How to Fetch Image Title/Description/LongDesc?

  • Resolved thinkstorm

    (@thinkstorm)


    17 years ago

    Hello All,
    I am looking for a way to change the way images are inserted in blog posts. I have a couple of issues:

    • The image uploaded uses the CSS class ‘alignright’, that is rendered correctly, but not in the editor. I would like to replace that with an “align=’right'” instead
    • Currently the title is hardcoded in the post – for me that doesn’t really make sense: the media library already has a title, alt text, and long description. When I change anything in the media library, that change should be reflected in all posts, which it currently doesn’t (for me)
    • For links to images, I want to add the title to the A-tag so the title shows up in the lightbox overlay

    Currently I run something like:

    add_filter('the_content', 'addlightboxrel_replace');
function addlightboxrel_replace ($content)
{   global $post;
    //$pattern = "/<a(.*?)href=('|\")(.*?).(bmp|gif|jpeg|jpg|png)('|\")(.*?)>/i";
	$pattern = "/<a(.*?)href=('|\")(.*?).(bmp|gif|jpeg|jpg|png)('|\")(.*?)>(.*?)title=('|\")(.*?)('|\")(.*?)<\/a>/i";
    $replacement = '<a$1href=$2$3.$4$5 title=$8$9$10 rel="lightbox[%LIGHTID%]"$6>$7title=$8$9$10$11</a>';
    $content = preg_replace($pattern, $replacement, $content);
    $content = str_replace("%LIGHTID%", $post->ID, $content);
    return $content;
}
?>

    This would insert the lightbox tag and a title. Problem now is: how do I set the title attribute of images to the title from the media library / alt text / long description? Shouldn’t there be a switch for that?

    Cheers,
    Thorsten

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter thinkstorm

    (@thinkstorm)

    I thought about it a bit more… since the image is inserted hardcoded in tinyMCE together with the A-tag, I guess I need two hooks,

    • tinyMCE Insert Image Hook, which puts a custom WordPress Plugin tag within the title and/or alt attribute
    • post load hook, which replaces any the custom WordPress Plugin tag for the title and/or alt attribute tag within A-tag / IMG-tag with a lookup of its value from the database

    I never programmed anything for WordPress yet, can someone please point me into the right direction in which .php files I would need to change code or how to add custom hooks (so wordpress updates don’t become a pain)?

    Cheers,
    Thorsten

    Thread Starter thinkstorm

    (@thinkstorm)

    I posted a quick and dirty solution at https://www.playoutintelligence.com/wordpress/ :

    <?php
/*
Plugin Name: Lightbox 2
Plugin URI: https://www.stimuli.ca/lightbox/
Description: Used to overlay images on the current page. Lightbox JS v2.2 by <a href="https://www.huddletogether.com/projects/lightbox2/" title="Lightbox JS v2.2 ">Lokesh Dhakar</a>.
Version: 2.5.0
Author: Rupert Morris
Author URI: https://www.stimuli.ca/
*/

/* Where our theme reside: */
$lightbox_2_theme_path = (dirname(__FILE__)."/Themes");
update_option('lightbox_2_theme_path', $lightbox_2_theme_path);
/* Set the default theme to Black */
add_option('lightbox_2_theme', 'Black');

/* options page */
$options_page = get_option('siteurl') . '/wp-admin/admin.php?page=lightbox-2/options.php';
/* Adds our admin options under "Options" */
function lightbox_2_options_page() {
	add_options_page('Lightbox Options', 'Lightbox 2', 10, 'lightbox-2/options.php');
}

function lightbox_styles() {
    /* The next lines figures out where the javascripts and images and CSS are installed,
    relative to your wordpress server's root: */
    $lightbox_2_theme_path = (dirname(__FILE__)."/Themes");
    $lightbox_2_theme = urldecode(get_option('lightbox_2_theme'));
    $lightbox_style = (get_bloginfo('wpurl')."/wp-content/plugins/lightbox-2/Themes/".$lightbox_2_theme."/");
    $lightbox_path =  get_bloginfo('wpurl')."/wp-content/plugins/lightbox-2/lightbox2/";

    /* The xhtml header code needed for lightbox to work: */
	$lightboxscript = "
	<!-- begin lightbox scripts -->
	<script type=\"text/javascript\">
    //<![CDATA[
    document.write('<link rel=\"stylesheet\" href=\"".$lightbox_style."lightbox.css\" type=\"text/css\" media=\"screen\" />');
    //]]>
    </script>
	<script type=\"text/javascript\" src=\"".$lightbox_path."prototype.js\"></script>
	<script type=\"text/javascript\" src=\"".$lightbox_path."scriptaculous.js\"></script>
	<script type=\"text/javascript\" src=\"".$lightbox_path."lightbox.js\"></script>
	<!-- end lightbox scripts -->\n";
	/* Output $lightboxscript as text for our web pages: */
	echo($lightboxscript);
}

/* we want to add the above xhtml to the header of our pages: */
add_action('wp_footer', 'lightbox_styles');
add_action('admin_menu', 'lightbox_2_options_page');
?>

    the plugin has no options page, it is so dirty my eyes hurt, nine search and replaces with regular expressions that can go wrong, and I bet it slows down access times, too, and is probably not cacheable.

    Please fix ??

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘How to Fetch Image Title/Description/LongDesc?’ is closed to new replies.