HTML and CSS modifications

Hello,

You may use the ‘simple_links_list_item’ filter to adjust the output any way you would like.

Here is an example of this usage with the sections displayed in the order you would like. Adjust as necessary.

add_filter( 'simple_links_list_item', 'sl_format', 1, 3 );
function sl_format( $output, $link, $object ){
	$class = 'simple-links-item';
	if( $object->args[ 'type' ] ){
		$class .= ' simple-links-' . $object->args[ 'type' ] . '-item';
	}
	$markup = '<li class="%s" id="link-%s">';

	$output = sprintf( $markup, $class, $link->ID );

	//title
	$output .= sprintf( '<a href="%s" target="%s" title="%s" %s>%s</a>',
		esc_attr( $object->getData( 'web_address' ) ),
		esc_attr( $object->getData( 'target' ) ),
		esc_attr( strip_tags( $object->getData( 'description' ) ) ),
		esc_attr( empty( $object->meta_data[ 'link_target_nofollow' ][ 0 ] ) ? '' : 'rel="nofollow"' ),
		$link->post_title
	);

	//image
	$output .= sprintf( '<a href="%s" target="%s" title="%s" %s>%s</a>',
		esc_attr( $object->getData( 'web_address' ) ),
		esc_attr( $object->getData( 'target' ) ),
		esc_attr( strip_tags( $object->getData( 'description' ) ) ),
		esc_attr( empty( $object->meta_data[ 'link_target_nofollow' ][ 0 ] ) ? '' : 'rel="nofollow"' ),
		$object->getImage()
	);

	//description
	$description = wpautop( $object->getData( 'description' ) );

	$output .= sprintf( '%s <span class="link-description">%s</span>', $object->args[ 'separator' ], $description );

	$output .= '</li>';

	return $output;
}