In AnQiCMS template development,wordwrapA filter is a utility used for line breaks in long text.The core function is to automatically wrap a text according to the set character length, with the aim of optimizing page layout and enhancing reading experience.However, when processing text that includes image links,wordwrapThe behavior has some points that we need to pay special attention to.
To understandwordwrapHow to handle image links, first you need to clarify its working principle. According to AnQiCMS documentation,wordwrapThe filter will insert line breaks at the character length we specify. It is worth noting that it 'distinguishes words by spaces', but if a 'word' (i.e., a continuous string without spaces) exceeds the set line break threshold,wordwrapIt will also be truncated in the middle of a word and wrapped in lines. This means it is a relatively 'rough' character-level wrapping and does not have the ability to understand HTML structure.
When the text contains image links,wordwrapthere are two common situations:
Image links exist in the form of plain text URLs:Assuming your text content directly contains a very long image URL, for example:
http://example.com/this/is/a/very/long/path/to/an/image/with/a/long_filename.jpg. BecausewordwrapThe filter will truncate even a single "word" when processing long strings, so if this plain text URL exceeds the length limitwordwrapThe set threshold will insert a newline character in the middle of the URL.Although this visually achieves a line break, the truncated URL will no longer be a valid link, and it may not be clickable or recognizable.Image links are in HTML
<img>Exist in tag form:It is more common for image links to be in HTML's<img>Embedded in text in tag form, for example:<img src="http://example.com/very/long/image_name_that_exceeds_wrap_length.jpg" alt="描述文字">. BecausewordwrapThe filter acts directly on the incomingstring contentIt does not intelligently identify and protect the integrity of HTML tags. Therefore, if this<img>tag is taken as a whole string, the internalsrcAttribute value (i.e., URL) or other parts make the entire tag's character length exceedwordwrapSet newline threshold,wordwrapAttempts will be made to insert line breaks within tags. The consequences of this behavior are catastrophic, it will destroy<img>The HTML tag structure causes the image to fail to load and display, even possibly triggering