• Resolved TiLK

    (@tilk)


    I would like to attach image to each link I have in my link list.

    Every link has title, description and one custom field that I use for date. I can position image above the title or next to the title by selecting an “Remove Line Break Between Image and Link” option. This places image next to the title, but the description and any additional fields would still go below it.

    Is there a way to place image on the left and title, description and any additional field on right next to it?

    https://www.ads-software.com/plugins/simple-links/

Viewing 1 replies (of 1 total)
  • Plugin Author Mat Lipe

    (@mat-lipe)

    Hi TiLK,

    this will take some creative reconsruction:

    If you add this to your theme’s functions.php it will get you close.

    add_filter( 'simple_links_list_item', 'sl_img_on_left', 1, 3 );
    function sl_img_on_left( $output, $link, $obj ){
    
    	$output = '<li class="simple-links-item" id="link-' . $link->ID . '" style="width: 100%; float:left; clear: both; list-style: none">';
    
    	$output .= '<div style="width: 50%; float: left; ">';
    
    	//Main link output
    	$link_output = sprintf( '<a href="%s" target="%s" title="%s" %s>%s</a>',
    		esc_attr( $obj->getData( 'web_address' ) ),
    		esc_attr( $obj->getData( 'target' ) ),
    		esc_attr( strip_tags( $obj->getData( 'description' ) ) ),
    		esc_attr( empty( $obj->meta_data[ 'link_target_nofollow' ][ 0 ] ) ? '' : 'rel="nofollow"' ),
    		$obj->getImage()
    	);
    
    	$output .= $link_output . '</div><div style="width: 50%; float: right; ">';
    
    	$output .= $obj->link->post_title . '<br>';
    
    	//The description
    	if( ( $obj->args[ 'description' ] ) && ( $obj->getData( 'description' ) != '' ) ){
    		if( $obj->args[ 'show_description_formatting' ] ){
    			$description = wpautop( $obj->getData( 'description' ) );
    		} else {
    			$description = $obj->getData( 'description' );
    		}
    		$output .= sprintf( '%s <span class="link-description">%s</span>', $obj->args[ 'separator' ], $description );
    	}
    
    	//The additional fields
    	if( is_array( $obj->args[ 'fields' ] ) ){
    		foreach( $obj->args[ 'fields' ] as $field ){
    			$data = $obj->getAdditionalField( $field );
    			if( ! empty( $data ) ){
    				$output .= sprintf( '%s <span class="%s">%s</span>',
    					$obj->args[ 'separator' ],
    					str_replace( ' ', '-', strtolower( $field ) ),
    					$data
    				);
    			}
    		}
    	}
    
    	$output .= '</div>';
    
    	return $output;
    
    }
Viewing 1 replies (of 1 total)
  • The topic ‘Alight description and custom fields next to image’ is closed to new replies.