Questions tagged [responsive]

The tag has no usage guidance.

Filter by
Sorted by
Tagged with
37
votes
5answers
30k views

How do I disable responsive images in WP 4.4?

I succesfully converted my 4.3.1 install to all https. After updating to 4.4. I have a problem with the new srcset attribute. While the src attribute for images is set using https, the srcset ...
18
votes
2answers
22k views

Proper usage of wp_is_mobile()?

I have developed responsive theme and I want to submit it the wordpress.org. Before submitting it I want to use wp_is_mobile() in my theme, but according to Function Reference/wp is mobile it is a ...
10
votes
3answers
11k views

make Wordpress image captions responsive

This webpage contains images inserted by Wordpress. The code used to insert the first image is: [caption id="attachment_887" align="alignnone" width="604"] <a href="http://steven.doig.com.au/...
9
votes
2answers
5k views

WP 4.4. responsive images browser choosing the “wrong” one

I'm glad that WP 4.4. ships with a built-in responsive image feature. But I'm not that happy with it. I have set up some custom image sizes in my functions.php: add_image_size('post-thumbnails', 600,...
9
votes
1answer
7k views

the_post_thumbnail responsive srcset not populating with custom image size

I am trying to use the new responsive images feature in Wordpress 4.4 but I keep running into a particular problem when trying to use the_post_thumbnail with a custom image size. It seems I cannot ...
8
votes
3answers
577 views

How to insert pictures without hard coded dimensions?

How can I insert pictures into a post without any hard coded dimensions (e.g. <img src="" alt="" /> instead of <img src="" alt="" width="" height="" />)? I don't want my users to switch to ...
7
votes
2answers
3k views

Responsive Theme Design: how have slideshow on desktops/tablets and static photo on mobile using same template?

I am building my first responsive WP site with my own custom WP Theme. The primary templates are part fluid, part fixed. This enabled me to create only 3 "versions", a desktop, tablet and mobile ...
7
votes
1answer
3k views

How-to make the admin area mobile friendly [closed]

Currently the admin-UI is a no-go for mobile browsers. Therefore I'm searching for a plugin that makes the back-end/admin-UI accessible and a little more friendly for mobile devices. Features, the ...
6
votes
2answers
362 views

Create image formats with different qualities when uploading

I'm trying to come up with a solution where the generated image formats cover both responsive and high-resolution aspects when uploading a new item in the WP admin. I've put together a set of formats ...
6
votes
1answer
1k views

Images all broken after migration and upgrade

I have upgraded a neglected Wordpress installation the was a few versions off. After the installation and upgrading multiple version, all of my images are now broken which were not before. Whenever ...
5
votes
1answer
2k views

How can I set image sizes and still have responsive images using the srcset attribute?

I have this function in my theme to create thumbnail sizes. set_post_thumbnail_size( 620, 848, true ); if (function_exists('add_image_size')){ add_image_size( '...
5
votes
3answers
2k views

How-to add rewrite rules to point the uploads folder to a subdomain

The goal Point the upload-folder to a static subdomain to serve adaptive images, that can get cached. WordPress Rewrite Rules You can read more in detail about rewrite rules API at Christopher Davis ...
5
votes
1answer
149 views

Pb with responsive image sizes in WP 4.4

I don't understand how to customize responsive sizes images in WP 4.4.1. The only available hooks that I see are wp_calculate_image_srcset and wp_calculate_image_sizes, and neither has the named ...
4
votes
3answers
278 views

Responsive Images

Is there a native function to display the correct responsive image size for post thumbnails or gallery images depending on the screen resolution? Normally I'm using: 1.Custom image sizes: function ...
4
votes
1answer
616 views

WP 4.4. responsive loads normal image after loading the responsive image

I have the 2 new added sized that I am testing: // testing add_image_size('new-small', 500, false); add_image_size('medium-large', 768, false); // just added today for devices support image ...
4
votes
1answer
580 views

How to get attachment id of background image?

I'm looking for a way to get the ID of the background_image when I am using custom headers? I tired using url_to_postid like this: $url = get_header_image() $postid = url_to_postid( $url ); and ...
3
votes
2answers
2k views

Implementing Zurb's Interchange Into Wordpress

I'm really scratching my head trying to figure out the best method for responsive images with Wordpress. Zurb just released a new javascript plugin for their Foundation framework. I'm using Foundation ...
3
votes
1answer
8k views

Making WordPress Gallery (.gallery-item) Responsive?

Shortcode for Gallery: [gallery link="file" columns="5" size="medium"] I’m using a 5 column gallery on an inner page of a website, obviously when the site responds down to mobile and even tablet ...
3
votes
1answer
6k views

Using FlexNav with WordPress [closed]

Has anyone managed to get the FlexNav plugin - http://jasonweaver.name/lab/flexiblenavigation/ - working with WordPress? I've got an HTML version of the site working fine, but I'm running into ...
3
votes
2answers
165 views

Featured Image in 4.4 should be larger on mobile device

I work on a theme that displays 3 columns with images, so the size for thumbnails on large displays will be 360x240px. When resized, on some mobile devices, like iPhone, there will be just 1 column ...
3
votes
1answer
592 views

WP 4.4 aspect ratio with responsive image

How to make new WP responsive image to choose images by filename and add them to srcset without checking aspect ratio? I have my own sizes: add_image_size( 'l', 992, 500, array( 'center', 'center' ) ...
3
votes
1answer
743 views

Wordpress core responsive video not working with shortcode

I cannot get the video from Wordpress core to behave responsively. I'm using the following CSS: .videocontent { width: 100%; height: 100%; max-width: 1024px; margin: 0 auto; } .wp-video-...
3
votes
1answer
3k views

How to oEmbed from custom field, responsive to container size and responsive

I am using Magic Fields 2 to add custom fields/meta boxes. One custom field is for a Vimeo or YouTube video URL to be displayed. The following code oEmbeds the video URL: <?php if (!((...
3
votes
3answers
15k views

How can I serve different images depending on screen size with wordpress

I am creating a responsive WordPress website with a mobile-first approach. When my client uploads an image for a blog post, I would like WordPress to then generate smaller versions of the image (with ...
3
votes
1answer
2k views

Benefits of storing uploads in an assets folder?

I'm trying to get up to speed with responsive theme development in Wordpress and have been looking at Bootstrap and combining it with HTML5 boilerplate. I came across this skeleton framework which ...
3
votes
2answers
2k views

Responsive background images added inline

I am setting the featured image as a background for the top part of the page. The images are quite large and I'd like to be able to set smaller image sizes for smaller screen sizes. Since the images ...
2
votes
2answers
2k views

Excess White Space Above Admin Bar on Frontend Using Twitter Bootstrap

The problem (Excess White Space Above Admin Bar on Frontend Using Twitter Bootstrap): While logged in and viewing the frontend -- If you shrink your browser down, there is an excess amount of white ...
2
votes
2answers
6k views

How can i disable a plugin for a mobile phone?

Is there a way I can not show something to mobile users? I have a floating social bar on my responsive theme, but it get in the middle of the content if I'm on my Android phone. I don't want to use ...
2
votes
1answer
8k views

Why is wp_get_attachment_image_src returning wrong dimensions? [duplicate]

I am using wp_get_attachment_image_src to construct the srcset attribute of an img tag. In that attribute I want to output a comma separated list of image urls along with the image widths. Using the ...
2
votes
3answers
14k views

the_post_thumbnail scaling not hard cropping

Lately I wanted to upgrade my blog with featured images/post thumbnails. I'm using a custom theme build on the roots theme (this is not a roots theme issue, I believe). The image I upload is 1024x768 ...
2
votes
2answers
4k views

How can I make new .css file in child theme override styles in child theme's style.css

I want to make a separate responsive.css file in my child theme but having trouble making the media queries override the styles in the child theme's default style.css. I've tried putting <link rel=...
2
votes
2answers
914 views

Wordpress Gutenberg Embed Blocks Are Not Responsive

I'm building a custom theme for a client's website and want to allow them to use embedded content in their posts (Youtube videos, Facebook posts, Twitter feeds, etc.) Typically, I've taken to severely ...
2
votes
2answers
1k views

How can I make wp default gallery responsive?

I want my WP default gallery to go from 4 columns on computer screens down to 2 on mobile devices.
2
votes
1answer
306 views

How to switch css files according to devices and button click?

I am trying to enqueue a responsive css file if the website is opened on mobile devices. Also I want to switch / enqueue a default or non-responsive css file when a button is clicked. The non-...
2
votes
3answers
2k views

How to use the responsive images feature from WP 4.4 in your themes

I don't really understand how I can use the new responsive images feature that WordPress provides in my themes. Example: In my theme, I add a header-image. I therefore use the custom-header-image ...
2
votes
1answer
320 views

Manipulate Output of wp_list_something: select menu instead of li's

I'm working on a responsive webdesign where my navigation should swap into a select-menu when resizing the window in smaller sizes. Is it somehow possible to add another param to functions like ...
2
votes
1answer
681 views

Generating Responsive Background Image Sizes in PHP

Im trying to generate responsive background images for my page header, using a modified version of this gist, but I cant get it to work correctly, and Im not sure if the issue is with ...
2
votes
1answer
439 views

Get specific image size for small viewport width

Im trying to get this featured image only when wiewport is < 768: add_image_size( 'img-movil', 660, false ); I have no much coding skills. I was reading about how to pass a variable from JS to ...
2
votes
2answers
129 views

How do I make featured images retreived by the_post_thumbnail() responsive?

I am trying to make the featured images retrieved by the_post_thumbnai() in the loop responsive, but can't seem to find a simplified solution. The logic I want to implement is something like this: ...
2
votes
1answer
77 views

Responsive Images Resizing Images

WordPress's automatic responsive image code is setting the size of certain images larger than it should be. Here is an example: On this page: http://healthyhints.wpengine.com/hot-yoga-benefits/, the ...
1
vote
1answer
2k views

$content_width for responsive UI

In our "mobile first" age a theme without responsive UI is treated like from stone age. It means that a theme could have different content width for different devices. But one of requirements for ...
1
vote
1answer
74 views

What tags should be used for themes to show the type of layout?

In the Tag Filter the old tags 'fixed-width' and 'flexible-width' were renamed to 'fixed-layout' and 'fluid-layout'. Also new 'responsive-layout' tag appears. Should users duplicate new tag 'fluid-...
1
vote
2answers
662 views

ACF Plugin - Random Gallery Image with wp_get_attachment_image()

I’ve found others (source 1, source 2, source 3) using the following code for displaying a random gallery image (and it works) with the ACF Plugin: <?php $gallery = get_field('images'); $rand = ...
1
vote
1answer
720 views

Get a list of all image sizes that match aspect ratio of original one

I need the same functionality as default WordPress wp_calculate_image_srcset() method which returns the string for srcset: image-300x200.jpg 300w, image-600x400.jpg 600w, ... but it should return an ...
1
vote
1answer
653 views

Featured image (responsive) above content is too small after update to WordPress 4.4

In my theme, I placed a featured image of a page above both the content and sidebar columns, spanning both columns, using <?php the_post_thumbnail('large'); ?> where "large" size is defined as ...
1
vote
1answer
2k views

Change theme based on window size

I want to send a browser info (window width) to the server via AJAX. The server doesn't need to respond with any data, however, only change the theme based on that window width. This is my attempt: ...
1
vote
2answers
331 views

Video to stretch across the entire homepage [closed]

Where could I find a framework for a homepage where I can have an HTML video stretched all the way across (to a certain max resolution would be fine, like max-width: 2500px or something)? I am using ...
1
vote
2answers
4k views

Responsive Images - Add srcset attributes to custom Images Function

When I use get_the_post_thumbnail( NULL, 'entry-fullwidth', NULL ); wordpress automatically outputs the srcset data like these: <img width="1000" height="625" src="https://x....
1
vote
3answers
74 views

What controls responsiveness in Wordpress?

I am testing a WP install along with a custom theme made by third parties. The theme per se is responsive, however in some situations, at particular resolutions, parts of the page will be blank ...
1
vote
3answers
3k views

Don't load scripts if on mobile/tablet

Would like to ask the question is it possible to stop the laoding of some scripts when viewed on a mobile/tablet device ? In the theme functions file you have wp_enqueue_script(...). How would you go ...