So I found this question here: Proper Way to Remove Thumbnail Links In Gallery and looks to have a good answer, but how can I make that apply only if the user is on a mobile browser, or at least if the screen is at a certain width?

Right now, I'm using the native wordpress gallery, and when you click the thumb, it takes you to the larger image. I don't want this to be done if you're on a phone or small width browser.

2 Answers 2

  1. First thing is first...
    you can use a mobile plugin to create a website especially for mobile users.
    I usally use WPtouch

  2. To check if a user is using a mobile browser / agent you can also
    use a function... that means you would need to update user agents
    from time to time...

Here is an example function from eric stokes site:

You can embed that function in your functions.php or include it into functions.php.
Then you can check and create a conditional link for example:

if(is_mobile()) {
   echo '<a href="http://www.mobile.com">i am using mobile</a>';
else {
   echo '<a href="http://www.desktop.com">i am using a desktop computer</a>';


Example relating to the answer you found here:

$image = wp_get_attachment_image( $id, $size, false );

// if it's set to not show the image link
if(isset($attr['link']) && ('none' == $attr['link']) && !is_mobile() ){
    // then just show the image
    echo $image;
} else {
    // else show the image wrapped in a link
    $link = wp_get_attachment_url($id);
    echo "<a href=\"$link\">$image</a>";

Hope this helps.
Cheers, Sagive

  • Hmmmm, well what you added to the code is correct, I'm sure, but the gallery thumbnails are still clickable when testing on a smartphone. I do have a huge list of user agents in my functions file, and I actually am using is_mobile in another section to completely hide something, and it works to hide it when testing on the phone. So, I guess the code from the question I referenced could be wrong now? Thanks so much for your reply by the way! Jul 2, 2013 at 23:59
  • Maybe you can pastebin the code you are trying to conditionally display.. that way we can directly edit it. First use echo 'test'; to check your trying to change the right code then share it & we will work it out 2ghter.
    – Sagive
    Jul 3, 2013 at 2:31
  • Well I'm just using the gallery shortcode to display native wordpress gallery thumbnails in my theme. Then of course, you click the thumbs and are taken to the large version. I was just hoping that I could prevent the loading/downloading of the big images if a mobile user clicks on the thumbs. It's not completely necessary for my mobile users to see the full size image. Thumbs are fine for them. Oh, maybe just tossing your provided code into the functions file isn't right? Jul 4, 2013 at 16:50
  • Then you need to find that shortcode where its coded and implement the condition there
    – Sagive
    Jul 4, 2013 at 18:12
  • Ok, directly into the template page then. I was trying that as well, but I will keep playing with it, and see what I can come up with. Thank you. Jul 5, 2013 at 4:13

Remove everything you don't need from the shortcode output.

add_shortcode( 'gallery', 'modified_gallery_shortcode' );

function modified_gallery_shortcode($attr)
  $output = gallery_shortcode($attr);

  if( wp_is_mobile() )
      // only keep these tags 
      $whitelist = '<img><div><figure><li>';

      // strip the rest
      $output = strip_tags( $output, $whitelist);

  return $output; // final html

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.