Questions tagged [responsive]
The responsive tag has no usage guidance.
240
questions
0
votes
1answer
247 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 ...
1
vote
1answer
49 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
278 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
179 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/...
-1
votes
2answers
2k views
Responsive table on ios safari
In chrome, firefox everything is fine.
On mobile ios safari it looks like the pic. The columns won't collapse into rows.
Tried the guide but didn't seem to work
https://css-tricks.com/accessible-...
0
votes
1answer
33 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
1answer
8k views
Why is this jquery / java script code not working in mobile / in devices?
I have following script in my header.php :
<script type="text/javascript">
/* to show back the left side bar back when the LEFT side bar is moved next/below to the center/content */
jQuery(...
0
votes
0answers
37 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 ...
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.
0
votes
2answers
188 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
350 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
98 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 ...
1
vote
3answers
1k views
Removing height and width from images with a caption
I am using WordPress with Twitter Bootstrap 3 and have an issue when it comes to images with captions.
Images with captions are given a height and width attribute which stops them from being ...
0
votes
1answer
29 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
488 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
675 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 = ...
5
votes
1answer
3k 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( '...
0
votes
1answer
747 views
the_content not showing responsive image attributes srcset or sizes
I'm using WordPress 4.4.2, but am unable to get the new responsive images functionality to appear for the_content.
It works for featured images, just not the_content images.
I have no plugins ...
0
votes
3answers
978 views
Wp_List_Table not responsive
im using the wp_list_table class on my backend theme, to show some informations that i have saved on database, but there is a lot of informations and i want to make it responsive, show/hide some ...
0
votes
1answer
25 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
13 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
2k views
Add div after every 4 posts then every 2 posts for a responsive loop
I'm currently working on a Wordpress loop for my index posts page. The loop displays the posts in 4 columns (each post has a width of 25%, so 4 posts on the same row), my purpose is to insert after ...
-1
votes
1answer
933 views
How to make this splash page responsive
I need to create a simple responsive splash page where there is a full background image with a logo, text and CTA on the top half of the image.
The Mobile_View image is how the page looks when ...
0
votes
1answer
192 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
394 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
732 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
124 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 ...
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 ...
-1
votes
1answer
16 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 ...
6
votes
2answers
366 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 ...
0
votes
1answer
47 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 ...
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 ...
1
vote
1answer
35 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
1answer
262 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
79 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?
0
votes
1answer
102 views
Open Menu is not working in Mobile view [closed]
my website is www.ukikomerc.com and my open menu is not working in mobile view. I already try to deactivate plugins but still, I have the same problem. Please help.
0
votes
0answers
27 views
Show a page of non-standard-sized featured images
I've struggled with this for years. I have a category page where I want to show the post summaries in a card format using the featured image (260 x 175px).
I have created a custom image size
...
-2
votes
1answer
930 views
Navigation menu, remove item from desktop
Using theme (and child theme) of Sailent, I'm trying to work out a way to completely remove a menu item from my navigation bar while on desktop. See site here: http://www.boinginflatables.com/...
0
votes
1answer
1k views
Change “posts per page” depending on width
I'm working on a responsive theme. One part is a sort of news flow (blog). In desktop widths (above 767px) the news template is vertically divided in two. The left part is a navigation which lists ...
0
votes
2answers
4k views
Move Sidebar from Above Content To Below When Responsive [closed]
My theme automatically puts the sidebar above the content rather than below it when going responsive/mobile.
I am trying to figure out how I can get it to go below the content instead, as having it ...
0
votes
1answer
648 views
Responsive images in Bootstrap 4 slider
I have a Bootstrap 4 slider in progress at https://filathlos.imagewize.com/ . When I add images of a 0.75 ratio like 2000x1500 they display and resize well. 3000x2000 works too. This with them being ...
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
1answer
130 views
Custom page template not working on mobile
I have a child theme. Within the child theme, I have a custom page template. It work perfectly on a desktop. It is not working on my iPhone with the Safari browser.
This is the template:
<?php
...
0
votes
1answer
1k views
Custom responsive 'featured image' sizes
My home page has a carousel of 'featured (thumbnail) images' from posts. The carousel uses about two=thirds of the screen width and Google Page Speed Analyser complains that my images are too large.
...
1
vote
3answers
8k views
How to display a different image size for mobile
I have set up the following:
add_image_size( 'featured-image', 1600, 450, true );
which is used to serve a full width image on the website I'm building, but, as you can imagine, for mobile this is ...
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 ...
