Stack Exchange Network

Stack Exchange network consists of 175 Q&A communities including Stack Overflow, the largest, most trusted online community for developers to learn, share their knowledge, and build their careers.

Visit Stack Exchange

Questions tagged [responsive]

The tag has no usage guidance.

0
votes
3answers
24 views

Title has word broken when viewed in mobile

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
0answers
21 views

Hestia Header Image, Troubles When Sized To Contain

I have seen that this theme is responsive, and is following material design principles, but there are issue with the header image. I want the full header image to appear on the frontend, if i apply “...
0
votes
1answer
7 views

setting heading size from theme option breaks responsive rules [closed]

A friend ask me to fix this issue over a site developed by another friend. So basically who costumize the site sets a H1 size of 120px, from theme option-->Typography; Whatiching how stylesheet and ...
0
votes
0answers
9 views

Home page responsive menu behavior [on hold]

The website uses the always responsive hamburger menu. I would like the hamburger menu to display open by default in the home page only showing the menu links. What would be the correct way to ...
0
votes
0answers
26 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
36 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
1answer
30 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
0answers
27 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 ...
1
vote
0answers
172 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
0answers
47 views

Customize Sizes Attribute for Default Image Sizes (Medium, Large)

I'm trying to modify the default 'sizes' attribute for images placed in content using the default WP sizes (e.g., Medium or Large). These are images generally placed in the body of a page/post with ...
0
votes
0answers
32 views

Overflow / stack pricing table in a grouped product page

I have been hitting my head over this for a while now, with no luck...for some, it may be a walk. So, This page has a subscription plan, and the products listed below, but the content of the product ...
0
votes
1answer
175 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,...
0
votes
1answer
8 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
31 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 ...
0
votes
1answer
26 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
269 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 ...
0
votes
1answer
47 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 ...
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 ...
1
vote
1answer
36 views

Best practice for query_posts in responsive design?

I'm working on a responsive design desktop/mobile but I have a doubt regarding PHP calls, as the hosting provider didn't like high cpu usage. In the loop query I have something like this: <?php ...
1
vote
0answers
193 views

ACF Wysiwyg Editor Image srcset for responsive images [closed]

I cannot find a way to generate srcset for images added inside Wysiwyg Editor field of Advanced Custom Field (ACF) plugin. Obviously, i know how to generate WordPress image srcset using: ...
0
votes
0answers
57 views

Responsive images with srcset

I know I have to use wp_get_attachment_image_srcset but I don't know how and where to put it?Any help <picture> <source media="(max-width: 659px)" srcset="inc/images/...
0
votes
0answers
33 views

Exclude original from responsive images srcset

I am trying to customise the searchset and exclude the original full size. This is the code I am using (I want to include sizes up to large, 1860px): add_filter( 'max_srcset_image_width', '...
0
votes
1answer
30 views

How can I hide/show text only for mobile users?

I have text content on a page that leads to too much scrolling on mobile devices. I'd prefer to avoid having separate pages for mobile/desktop. Ideally, an editor would add a shortcode around certain ...
0
votes
0answers
30 views

Getting extra image links in code with wp_get_attachment_image

I am using ACF to add image fields to some posts and returning the Image ID so that I can use wp_get_attachment_image to get responsive images. I have defined 960 and 1920 as the medium and large ...
0
votes
2answers
109 views

Adding srcset to an image in ajax

I have this line of code : $out .= get_the_post_thumbnail('', '', array( 'alt' => the_title_attribute (array('echo' => 0) ), 'class' => 'img-responsive', 'srcset' => ...
1
vote
2answers
129 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 ...
0
votes
2answers
77 views

GIF featured image is resized on server but not used in frontend. Why?

I use a very basic setup of twentyseventeen and die most recent wp version. When I upload PNGs or JPGs they as a featured image, they are saved as a resized version on my uploads folder and used on ...
0
votes
0answers
13 views

Only display previous and next items in video player playlist

My WordPress theme has the following PHP function that displays a video player with a playlist, and assigns the themotion-playlist-playing class to the currently selected item. To prevent long ...
0
votes
0answers
25 views

Video Player “Width Issue”

Hello"I buy theme and when i upload video width size half see in image please help me to solve this issue & i am upload openload load movies and in theme have custom css option openload embed ...
0
votes
0answers
48 views

How to add “srcset” and “sizes” attributes to images in sidebar?

Is there a way to add srcset and sizes attributes to images in the sidebar? I know we can use the following hooks for images in posts/pages and featured images: wp_calculate_image_sizes ...
0
votes
1answer
26 views

built-in responsive images in content - do I need to add anything to functions.php?

I am making a WP theme from scratch and I don't seem to get the responsive images working. An image that's inserted at 500px will stay at 500px even though srcset and sizes tags are added. From my ...
0
votes
1answer
363 views

How to select which thumbnails sizes are displayed in srcset

I know that Wordpress has its way of letting the browser decide which image to download depending on the viewport via the srcset. I also know that I can use the_post_thumbnail function and specify a ...
1
vote
2answers
341 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 = ...
0
votes
2answers
1k 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 ...
0
votes
1answer
21 views

Reduce size of responsive title

When using a mobile device or a tablet, the titles of my products are cropped. I'd like to simply reduce their size. Take a look to the image: Is there a way to change that? Is it CSS or Php? The ...
1
vote
0answers
26 views

Translate a word in a responsive menu

The responsive menu of my web has a word in english: "back" and I have to translate it in Spanish: "atrás". Well, I'm not able to find the word to translate. It's not included in the pot file (...
0
votes
1answer
12 views

Website Tablet Check Out Field Issue

So on my website of http://www.camerabeanbags.co.uk/checkout/ if you set the browser to 768px wide the 'phone' and 'e-mail address' fields can not be clicked in for text to me typed in. These work ...
0
votes
1answer
111 views

Understanding WordPress image sizes and responsive images

I just can’t understand how add_image_size() and responsive images work. So let’s say I have a thumbnail like 720×360. So I’m assuming I need to add the size add_image_size('post-thumbnail', 720, ...
1
vote
1answer
272 views

Twenty fifteen theme - change responsive menu condition

So I want to move sidebar to the top of the page and hide it behind hamburger menu. Just to make it exactly like when the screen is smaller (tablet, smartphone), despite resolution. So I thought ...
0
votes
2answers
1k views

Bootstrap navbar responsiveness on WordPress theme menu not working

The theme I am creating is not working correctly. The menu is not collapsing into mobile view with the hamburger icon when I decrease screen size. I can see all the classes when using the inspect tool ...
1
vote
1answer
473 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 ...
0
votes
1answer
75 views

Responsive Images with art direction

I've been thinking about how I would use responsive images in Wordpress. My site has a fixed height, full width thumbnail at the top of each post. The built in Wordpress implementation of responsive ...
-1
votes
1answer
15 views

responsive screen not working [closed]

i already try to make this responsive like this: https://www.w3schools.com/css/tryit.asp?filename=tryresponsive_image2, i want it like shrink like an image, whatever screen in it, it will match in the ...
1
vote
2answers
2k 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
votes
0answers
106 views

Adding responsive image sizes

I've used this Gist to try and help make a Divi theme a bit more responsive, but the call 'wp_make_content_images_responsive( string $content )' doesn't seem to be populating the image size array Is ...
0
votes
1answer
42 views

@media applying globally and not separately for each screen width [closed]

I have the 1920px stylesheet complete at a page width of 1560px. I'm trying to style the next width for 1366px screens using @media queries but when I change anything it changes globally. I'm a ...
1
vote
1answer
30 views

@media in bluehost is being commented out [closed]

Bluehost which is hosting my WordPress files, doesn't seem to be reading my @media code. Everything starting with an @ symbol is greyed out and is not being read at all which means my site is ...
1
vote
2answers
893 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.
1
vote
1answer
204 views

WP Responsive images - upload custom image sizes

I've been trying to find solution to my problem for the last couple of weeks without any luck. I've been finding that my theme and WP both fail to create proper responsive images. This especially goes ...
0
votes
0answers
66 views

How can I disable Jetpack plugin on mobile?

I'm using the Wordpress jetpack plugin to create a gallery on a WP site. However I want to disable it completely based on the visitors viewport, how can I achieve this?