3.4 KiB

Raw Blame History

Image and Template Issues Analysis

Problems Identified

1. Missing Image CSS in Templates

Issue: None of the templates (basic, modern, classic) have CSS for <img> tags.

Impact: Images display at full size, breaking layout especially in modern template with constrained article width (850px).

Solution: Add responsive image CSS to all templates:

img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 1.5rem auto;
    border-radius: 8px;
}

2. Template Storage Inconsistency

Issue: template_used field is only set when apply_template() is called. If:

Templates are applied at different times
Some articles skip template application
Articles are moved between sites with different templates
Template application fails silently

Then the database may show incorrect or missing template values.

Evidence: User reports articles showing "basic" when they're actually "modern".

Solution:

Always apply templates before deployment
Re-apply templates if template_used doesn't match site's template_name
Add validation to ensure template_used matches site template

3. Images Lost During Interlink Injection

Issue: Processing order:

Images inserted into content → saved
Interlinks injected → BeautifulSoup parses/rewrites HTML → saved
Template applied → reads content → creates formatted_html

BeautifulSoup parsing may break image tags or lose them during HTML rewriting.

Evidence: User reports images were generated and uploaded (URLs in database) but don't appear in deployed articles.

Solution Options:

Option A: Re-insert images after interlink injection (read from hero_image_url and content_images fields)
Option B: Use more robust HTML parsing that preserves all tags
Option C: Apply template immediately after image insertion, then inject interlinks into formatted_html instead of content

4. Image Size Not Constrained

Issue: Even if images are present, they're not constrained by template CSS, causing layout issues.

Solution: Add image CSS (see #1) and ensure images are inserted with proper attributes:

<img src="..." alt="..." style="max-width: 100%; height: auto;" />

Recommended Fixes

Priority 1: Add Image CSS to All Templates

Add responsive image styling to:

src/templating/templates/basic.html
src/templating/templates/modern.html
src/templating/templates/classic.html

Priority 2: Fix Image Preservation

Modify src/interlinking/content_injection.py to preserve images:

Use html.parser with preserve_whitespace or html5lib parser
Or re-insert images after interlink injection using database fields

Priority 3: Fix Template Tracking

Add validation in deployment to ensure template_used matches site template
Re-apply templates if mismatch detected
Add script to backfill/correct template_used values

Priority 4: Improve Image Insertion

Add max-width style attribute when inserting images
Ensure images are inserted with proper responsive attributes

Code Locations

Image insertion: src/generation/image_injection.py
Interlink injection: src/interlinking/content_injection.py (line 53-76)
Template application: src/generation/service.py (line 409-460)
Template files: src/templating/templates/*.html
Deployment: src/deployment/deployment_service.py (uses formatted_html)

3.4 KiB Raw Blame History