0

We are moving a large newspaper website from Drupal to WordPress and my last coding tweak involves displaying the legacy caption information from images in article posts. The caption information is included in "alt" and "title" attributes in the HTML for these images, so I basically need to display this info in the template for article posts. Any suggestions on how to set this up? Here is some sample code from an image in an article:

<img src="/directory/image/00%202016%20NEWS%20PHOTOS/12%20December/match%20race%20waterfront.jpg" alt="Boats dash past the Charlotte Amalie waterfront during Sunday's CAMR action. (Photo provided by the Carlos Aguilar Match Race)" title="Boats dash past the Charlotte Amalie waterfront during Sunday's CAMR action. (Photo provided by the Carlos Aguilar Match Race)" width="280" vspace="4" hspace="8" height="187" border="1" align="left" />

What we want to do is display that text from the "alt" or "title" attributes as captions under the images. This needs to be set up for 100,000 legacy article posts on the sites.

0

A WordPress approach

If you have all your Images in the media gallery, you are able to access their post object while embedding/including the images via tinyMCE or plain PHP. WordPress uses wp_prepare_attachment_for_js to get all information about their images for their blade templates. Maybe this will help you to get started.

A maybe approach

Filter the_content on output. This solution with DOMDocument/DOMNode is heavy on the server and should be cached or saved or not done at all.

add_filter('the_content', 'my_image_filter');
function my_image_filter($content) {
    $doc = new DOMDocument();
    $doc->loadHTML($content);
    $images = $dom->getElementsByTagName('img');
    foreach ($images as $img) {
        $info = $img->getAttribute('alt');
        $alt = $doc->createElement('p', $info);
        //TODO: Adding $alt Node somewhere or replacing Image Node...
    }
    return $doc->saveHTML();
}

Another approach

While migrating the content, filter the alt tag and append some html after the images. If you have your images not within WordPress make a custom tinyMCE integration that handles images as described above.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.