[ASSETS-61931]: Updating documentation for retaining external images in doc based authoring - #131
[ASSETS-61931]: Updating documentation for retaining external images in doc based authoring#131gazal2708 wants to merge 7 commits into
Conversation
|
Hello, I'm the AEM Code Sync Bot and I will run some actions to deploy your branch and validate page speed.
|
anuraggupta228
left a comment
anuraggupta228
left a comment
There was a problem hiding this comment.
make it concise. looks pretty long to read thru from readar pov.
summary, troubleshooting guide, scope, limitation, steps involved .. etc seems relevant.. rest all can be skipped.
|
|
||
| ## Overview | ||
|
|
||
| In document-based authoring (using Google Docs or Microsoft Word), when you insert images from AEM Assets with external URLs (Dynamic Media, Scene7, etc.), they are typically rendered as **anchor tags (`<a>`)** pointing to the image URL. |
There was a problem hiding this comment.
(using Google Docs or Microsoft Word) --> not needed
|
|
||
| ## Overview | ||
|
|
||
| In document-based authoring (using Google Docs or Microsoft Word), when you insert images from AEM Assets with external URLs (Dynamic Media, Scene7, etc.), they are typically rendered as **anchor tags (`<a>`)** pointing to the image URL. |
There was a problem hiding this comment.
they are typically rendered as
they are rendered OOTB as
|
|
||
| 1. **Detect anchor tags** that point to external image URLs | ||
| 2. **Decorate them into `<picture>` elements** with responsive sources using the AEM Assets Plugin | ||
| 3. **Configure handlers** for different image source types (DMwOAPI, Scene7, etc.) |
There was a problem hiding this comment.
for all the ref that can be embedded with hyperlinks from asset plugin, lets add it
|
|
||
| **Key Difference from Universal Editor:** | ||
| - ❌ No `externalImageUrlPrefixes` feature flag support in document-based authoring | ||
| - ✅ External URLs are naturally retained as anchor tags |
There was a problem hiding this comment.
use OOTB keywords wherever seems the right fit..
There was a problem hiding this comment.
2nd and 3rd points seems irrelevant from doc context.
| - ✅ Frontend decoration handles everything automatically | ||
|
|
||
| **Key Benefits:** | ||
| - ✅ Responsive images with multiple breakpoints |
There was a problem hiding this comment.
multiple -> customizable
| ↓ | ||
| 11. Original <a> tag replaced with optimized <picture> in DOM | ||
| ↓ | ||
| 12. Browser loads appropriate image based on viewport and format support |
There was a problem hiding this comment.
add code reference links to each .. would be intuitive for reader
|
|
||
| ### 📦 Installation | ||
|
|
||
| For complete installation instructions, refer to the official plugin documentation: |
There was a problem hiding this comment.
add reference to plugin repo. Avoid ambiguity/duplicacy
|
|
||
| | Handler | Input Format | Output Format | Use Case | | ||
| |---------|-------------|---------------|----------| | ||
| | `createOptimizedPictureForDMOpenAPI` | DMwOAPI URL | AVIF sources | AEM Assets with Dynamic Media OpenAPI | |
There was a problem hiding this comment.
these looks useful but given you've already added steps involves in transforming the assets from to
| # Should return 200 OK | ||
| ``` | ||
|
|
||
| 2. **Check CORS settings** |
There was a problem hiding this comment.
delivery url will never have CORS IMO
| - AEM Assets delivery must allow your domain | ||
| - Check browser console for CORS errors | ||
|
|
||
| 3. **Verify query parameters** |
There was a problem hiding this comment.
a lot of these steps looks overkill .. just curl, checking dam:roles , asset is approved should suffice, beyond that reach out to DM team should be instructed.
gazal2708
changed the title
gazal2708
changed the title
|
@gazal2708 , probably we should have all instruction docs consolidated in https://github.com/adobe-rnd/aem-assets-plugin repo. This repo is just an example site on how to use the plugin. |
|
Moving the documentations to aem-assets-plugin |
3 participants
Fix #133
Jira - ASSETS-57915
URL for testing:
https://main--franklin-assets-selector--hlxsites.aem.live/ext-images/external-images-example