I have a couple issues with the mobile rendering of my website at https://cincinnati.unitedresourceconnection.org
I have images that are converting to 100% width when viewed on mobile, that otherwise display with the proper dimensions when viewed in desktop mode.
There are two situations in which this is occurring. First, I’m calling the buddypress profile image in my blog excerpts for attribution of authors. This is viewable as you scroll down the front page of my site. I’m using a function to make this call:
/*********************************************************************************************************
* Excerpt [This pair of functions removes the seos parent exerpt and replaces it with a custom excerpt that links to the author's buddypress profile page.]
**********************************************************************************************************/
function child_remove_parent_exerpt() {
remove_filter( 'excerpt_more', 'seosbusiness_excerpt_more' );
}
add_filter( 'wp_loaded', 'child_remove_parent_exerpt' );
function urc_excerpt_more( $more ) {
return ' <br /><br /><a class="read-more" href="'. get_permalink( get_the_ID() ) . '">' . __('Read More', 'seos-business') . '</a>' . '<br />' . get_avatar( get_the_author_meta( 'ID'),'32') . ' Shared by ' . '<a href="' . '/member-directory/' . get_the_author_meta( 'user_login' ) . '/profile">' . get_the_author() . '</a> ' . get_the_date();
}
add_filter( 'excerpt_more', 'urc_excerpt_more' );
In the second case, I’m calling a shortcode on my index page to display a dropdown of international flags representing translation options.
<center><?php echo do_shortcode('[gtranslate]'); ?></center>
I’m not the best with css… Any suggestions on how to fix this?