Image with name in List Form

  • Resolved JMedia

    (@seotoronto7)


    10 years, 5 months ago

    I’m trying to create a list of the Taxonomy Images with the name and print them in list form.

    I am using the following code but I can’t get it to add the HTML elements for the list with class:

    add_shortcode('taximage', 'taximage');
function taximage() {
    global $post;
    $terms = apply_filters( 'taxonomy-images-get-the-terms', '', array(
    'taxonomy'     => 'property-feature',
	'after'        => '</div>',
    'after_image'  => '</span>',
    'before'       => '<div class="my-custom-class-name">',
    'before_image' => '<span>',
    'image_size'   => 'detail',
	) );
foreach( (array) $terms as $term) {
$out .= wp_get_attachment_image( $term->image_id, 'detail','' );
$out .= $term->name;

}

    [Moderator Note: Please post code & markup between backticks or use the code button. Your posted code may now have been permanently damaged by the forum’s parser.]

    Any help would be appreciated.. Thanks!

    https://www.ads-software.com/plugins/taxonomy-images/

Viewing 1 replies (of 1 total)
  • Thread Starter JMedia

    (@seotoronto7)

    I resolved my issues once I finally tried a few things..:

    This will list the taxonony images relevant to a post with the taxonomy name as a shortcode :

    add_shortcode('taximageslist', 'taximageslist');
function taximageslist() {
    global $post;
    $terms = apply_filters( 'taxonomy-images-get-the-terms', '', array(
    'taxonomy'     => 'change-to-your-taxonomy-name',
    'image_size'   => 'detail',
	) );

$out .= '<div id="taxonomy-images-the-terms"><ul class="taxonomy-images-the-terms">';
foreach( (array) $terms as $term) {
$out .= '
<li>' . wp_get_attachment_image( $term->image_id, 'detail'). '<span class="termname">' . $term->name . '</span></li>
';
}
$out .='
<ul></div>';
return $out;
}

    [Moderator Note: Please post code & markup between backticks or use the code button. Your posted code may now have been permanently damaged by the forum’s parser.]

    Add short code to your WordPress post/page:
    [taximageslist]

    CSS I used to display equal width columns with vertical center text to image: (add to theme custom.csss)

    #taxonomy-images-the-terms ul li {
    list-style-image:none;
    list-style-type:none;
    display:table-column;
    width:110px;
    line-height:15px;
    height:30px;
    margin:0 0 10px 0;
    }

    .termname {
    padding-left: 5px;
    text-align: left;
    height:30px;
    margin-left:35px;
    display:table-cell;
    vertical-align:middle;
    }

    Hope this helps someone else…

Viewing 1 replies (of 1 total)
  • The topic ‘Image with name in List Form’ is closed to new replies.