90 lines
3.4 KiB
Markdown
90 lines
3.4 KiB
Markdown
# 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:
|
|
```css
|
|
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:
|
|
1. Images inserted into `content` → saved
|
|
2. Interlinks injected → BeautifulSoup parses/rewrites HTML → saved
|
|
3. 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:
|
|
```html
|
|
<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`)
|
|
|