Podcast #128: We chat with Kent C Dodds about why he loves React and discuss what life was like in the dark days before Git. Listen now.

Questions tagged [responsive]

The tag has no usage guidance.

Filter by
Sorted by
Tagged with
0
votes
1answer
462 views

Trouble with responsivitizing my twentythirteen header

I'm using the twentythirteen theme and trying to get the header to adapt to screen resolution. I've uploaded several image files with the required resolutions, and changed my custom-header.php source ...
2
votes
1answer
686 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 ...
0
votes
0answers
13 views

Twenty seventeen header is not responsive

Hello the header of my Twenty Seventeen website is not responsive: when I open the site on my mobile phone (vertical view) the image is cropped. When in horizontal view everything is ok. All other ...
0
votes
1answer
564 views

menu mobile show up even i in desktop mode in Newspaper Theme

I have WordPress website with Newspaper Theme and I have a problem with the Menu. Link: demo2.tmanow.net I have 2 problems: The menu mobile show up in left side even i in desktop mode, this not ...
0
votes
0answers
9 views

Srcset doesnt show at all in my wordpress images

I have added 10 image sizes: add_image_size( '1920', 1920, 384, false ); add_image_size( '1600', 1600, 320, false ); add_image_size( '1536', 1536, 307, false ); add_image_size( '1440', 1440, 288, ...
0
votes
0answers
20 views

How to center entire columns on a page, and have it stay responsive?

Page in question: https://princetonfireandsafety.com/contact-info/ I just want the two columns to be centered in the page (but the text left-aligned still). I would prefer to use the columns block ...
0
votes
0answers
14 views

Mobile responsible woocommerce product page

Dear Stackexchange community, I'm currently working on a Woocommerce / Wordpress project and there's something I can't figure out how to do. I couldn't much info online about my issue: When looking ...
0
votes
1answer
12 views

Disable rendering of objects on mobile/above certain screen resolution

I have two sliders (Revolution Slider on WordPress), one for desktop and one for mobile. The desktop slider is currently set to disable completely on browsers below 1199px. This is a Revolution Slider ...
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 ...
0
votes
1answer
24 views

New Styles Not Rendering On Mobile Phone and Tablet

I've come across a rather interesting problem and I'm completely baffled. I've never encountered this before in the past. My Goal To make a form on my website mobile responsive Problem Absolutely ...
0
votes
0answers
26 views

Add file extension to function wp_get_attachment_image_srcset()

The function wp_get_attachment_image_srcset() delivers the srcset information of an image. Is it possible to write a seperat function to add an additional extension (.webp)? Output of the function ...
0
votes
1answer
766 views

Responsive Featured Images Not Working

Perhaps I am misunderstanding (likely) but I am trying to use TwentySixteens method to try and make the images I upload through WordPress responsive. I have only barely modified the code, but no ...
1
vote
1answer
26 views

Mobile issue – website isn't properly detecting screen size [closed]

my question concerns this website (currently on my staging server): https://sunstonebookkeeping.markhannondesign.com The theme is a child theme of a parent theme I created with Underscores and ...
0
votes
0answers
28 views

How can use wp_get_attachment_image_srcset for WebP?

I want to serve both JPG and WebP versions of the images.
0
votes
0answers
23 views

How Get rid of srcset on a image size and force the size on all screen?

I recently figured out a huge problem for images on my site. I recently disabled all the WordPress image sizes (thumbnail, large, medium-large) except for the medium size. Now I only have medium and ...
1
vote
1answer
684 views

wordpress responsive image srcset not working

I'm trying use wordpress core responsive image feature but it's not adding srcset to image. Here is th my codes I have a div w=370px h=280px now I added image sizes if(function_exists('...
0
votes
1answer
435 views

Backstretch.js and thumbnail sizes to reduce loading time

I am using backstretch.js to set a featured image as a full size background image (as per this tutorial). I would like to combine this approach with different thumbnail sizes in order to reduce ...
0
votes
0answers
107 views

Wordpress Toggle Menu has stopped working

I am using the twentyfifteen theme on my wordpress site. When you access the site on mobile or resize on your browser so that the page height > width, a hamburger icon appears on the upper right. I ...
0
votes
0answers
10 views

WooCommerce sorting-order in responsive layout wrong

I have a problem with my main WooCommerce-Shop page: I have 6 products in it, which should be sorted by names as follows: 1, 2, 3, 4, 5, 6 This works fine on a PC or Device with a large display width (...
1
vote
1answer
518 views

Using SRCSET with Images and Featured Images

I have been trying to get SRCSET to load in images for different device sizes. My understanding is that when the device width or window width changes, that SRCSET will ONLY load the URL of the ...
1
vote
1answer
97 views

Fallback for missing srcset images

I'm trying to optimize responsive images on our site. We use WordPress. Not all image thumbnails are generated because of aspect ratio needs to be proportion to the original image. Some of our images ...
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: ...
0
votes
0answers
34 views

Is it possible to remove original src from wp_calculate_image_srcset() results?

Was just wondering how one could load a custom srcset stack. I know the srcset loads all registered sizes so I'm good on that side but I cannot find a way to remove the original src from there without ...
1
vote
0answers
28 views

max_srcset_image_width doesn't work as intended

I register a new image size in my theme, i.e: add_image_size('home-slide', 1500, 756, true); and I set the maximum size for the srscet attribute of responsive images to 1024: function ...
0
votes
2answers
63 views

My website is not responsive on mobile devices

I'm building a Wordpress website at http://xscoder.com/wp-demo/test/ I am not able to make it responsive, although all CSS and JS scripts are successfully loaded, as you may see in the Inspector. I ...
2
votes
2answers
933 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 ...
1
vote
1answer
52 views

Responsive 2 column staggered layout client expectations vs reality problem

In a bit of an urgent bummer at the problem, we developed and delivered a Wordpress site with blog post layouts that are split in 2 columns via Gutenberg built in columns, on desktop, the site appears ...
0
votes
0answers
15 views

Responsive Images - Defining

I am relatively new to working on themes with WordPress. I am wondering how I can change the responsive looker for images based on the screen size. I want to be able to change the min-size with @media ...
0
votes
0answers
23 views

Show desktop screen for tablets (using Elementor + Bootstrap + WordPress)

I am working on the website www.unityinfinity.com/ui The website shows the tablet view from 768px to 992px. I want to show the desktop view on tablets by default instead of the weird screen that is ...
0
votes
0answers
10 views

How to add responsive image support for imported posts?

The images are called using standard html with only an image class and source and all images are attached to the post. The image sizes have been generated, but I don't know how to call them. I can ...
0
votes
1answer
35 views

Menu toggle bar works only on some pages in WordPress

I'm using a custom WordPress theme extended from Twenty Sixteen for this website. It is using Bootstrap (I had to migrate a static Bootstrap website to WordPress). If you open the website on mobile, ...
0
votes
3answers
33 views

Title has word broken when viewed in mobile [closed]

I am designing a website using the Renden Free theme, and my problem is that some long titles, when viewed in mobile, have words broken in half. For example: As you can see, the word "Corporal" gets ...
0
votes
2answers
5k views

Meta tag viewport

I made my very own WordPress theme from scratch and I don't use a header nor a footer for it (so no header.php or footer.php files present). All of the important content is directly in the index.php ...
0
votes
0answers
170 views

Multiple responsive Bootstrap carousels via shortcodes

I'm writing a shortcode to display responsive Bootstrap carousels that adjust column numbers according to browser width. It works for a single shortcode, and responsively adjusts as follows: However,...
0
votes
1answer
114 views

add class to all images inside the content

I have a function like this : function add_responsive_class($content) { $content = mb_convert_encoding($content, 'HTML-ENTITIES', "UTF-8"); if (!empty($content)) { $document = new ...
0
votes
2answers
982 views

Disable Media File Image Link On Mobile Devices

I'm looking to disable the 'media file' image link on mobile devices, so that when viewing a site on mobile devices we simply have the image being displayed with no link to anything. I am looking to ...
1
vote
3answers
14k views

Convert WP Menu to a Drop Down for Mobile browser

I'm working on a wp project with responsive theme. I have single level nav menu at the top of the site, that I want to change to a Select Option tag for mobile browsers (small screens) with options ...
0
votes
4answers
31k views

All 3?: Responsive resizing of images + image width of actual image for small images + max-width for all larger images

What I'd like to achieve is to have images resize responsively – and for that I have to set 'width: 100%' – and at the same time set a maximum width to not have the image as wide as the content To do ...
0
votes
1answer
43 views

Menu is in Reversed order

I cannot seem to figure out why this menu is in reversed order only for Mobile. site-navbar.php <div class="menu-container"> <div class="menu w-full mx-auto container xl:pr-16"> ...
0
votes
2answers
2k views

How to exclude an image size from the Wordpress srcset

Wordpress srcset is a great feature but there are occasions when it's important to control exactly which image sizes are included in the srcset code. For example, on one of our sites we generate a ...
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 ...
0
votes
1answer
693 views

How to Make Wordpress Default gallery responsive on mobile?

I have read about the subject in many blogs and forums but I have not achieved anything. What I would like to do on my page is the following: decalaveras.com On this page, when accessed from mobile,...
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....
0
votes
1answer
10 views

Decide how Hero image appears on mobile

I generally can google my way to an answer but I can't for the life of me figure out what this is actually called. I apologize in advance. I have a hero image that looks great on a full-size screen. ...
0
votes
1answer
55 views

How to accept images at multiple sizes and aspect ratios and display as standardized image size / ratio?

Lets say I accept guest post submissions. On the post archive page I have the image the user uploaded with the post on the left and an excerpt of the post on the right. Unless I programmatically ...
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 ...
0
votes
1answer
40 views

Change Responsive Images Maximum Width of 1600px

Sorry for my English first. Just started with responsive Images and read https://make.wordpress.org/core/2015/11/10/responsive-images-in-wordpress-4-4/ So according to this post, there is a maximum ...
0
votes
1answer
235 views

How to edit embed filter for youtube video to allow responsive full width layout

Im trying to edit the suggested embed filter from wordpress.org to make youtube videos always stay 100% width inside its container div, while keeping the appropriate height dimension as needed. Is ...
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/...
1
vote
0answers
17 views

CSS: How can I show a photo beyond the template's column, but contained within the browser window? [closed]

I'm stuck with a CSS issue and hoping someone knowledgeable can help. I have a nice responsive template that I'm trying to customize with this one tweak, but I can't figure it out. My site is a ...