It's hard to fit nicely a large table with lots of info (eg price table, size chart etc) on a product web page. But eBay has it figured out. Anyone knows how they do this responsive pop up ?
eBay size chart:
On a laptop, it opens as a popup window. It's smaller than the layer below. To return to the product page, there's the classic x button in the upper right corner.
On mobile, it appears to be a regular page, but without the usual header or menu. Just a "Back" button at the top of the page and a table with the size info.
My question: I'm looking for a way to achieve this nice responsive (pop-up turns into a regular page on mobile) effect for my Wordpress website.
For the responsive pop-up view, you should try WP Post Popup WordPress plugin.
Maybe you get what you want in mobile view.
Related
My situation is the following:
I have a WordPress eCommerce website with several products on it. On the product pages, obiously there are pictures of the product. When you select the picture, it opens a pop-up screen with an enlarged version of the product picture.
Recently I have noticed that, when people open the product image pop-up on a mobile device, they start scrolling. I assume this is because they expect the pop-up to close when scrolling.
All these functions (product page, product image pop-up) are created by WordPress plugin WooCommerce. The layout and style are created by my selected WordPress Theme. This means I have access to some funtions but changing things like JavaScript is not an easy thing to do.
So my question is:
Is there a way to add functionality to close the product image pop-up when scrolling on a mobile device?
Thanks in advance for any help, I would really appreciate it!
Yes it can be close easily.
You can do from your page builder option Like Elementor, WPBakery Page Builder or anything that are you use.
Secondly you can close it using JavaScript.
You can do from your Theme Option.
Thank you Hope it will Help you
good day,
I am using Wordpress and Elementor Pro for creating my website but I want to do like photo attached but I could not
I search a lot and found some said two buttons or nav menu or hamburger panel
but I didn't find any of these
So how can I make like this once user choose button shows up something else?enter image description here
Did you try "Tabs"? You can place her different contents at the same area by clicking the Tab Title which you could style with css.
I have noticed that the basic Woocommerce orders list admin page does not show properly on mobile devices (iPhone 6/8/8+/MAX at least). Seems there is no separate design for small screens and the page just tries to resize to fit the screen, which creates a lot of artefacts like text being shown over checkboxes, columns missing, etc. Moreover -
i have added, by means of code, a couple of custom columns to Woocommerce orders admin list. They show fine on desktop, but on mobile the whole screen is distorted and even sometimes flickers endlessly as if trying to redraw again and again.
I am trying to achieve the nice screen that is seen on mobile when entering WordPress admin lists. Pages, where there is the main column, which is displayed regularly and then there is a small button (class="toggle-row") which on-click (implemented in common.js) toggles "is-expanded" class to the rest of the columns which are then displayed in a list like manner.
First, I would like to know how to config the boilerplate Woocommerce to have the back office be mobile friendly. Then I would like to know how to fit my custom columns into that scheme as well
I really appreciate your generosity in taking the time to help me out!
I am working on a portfolio site to showcase my graphic work on wordpress.
For most themes, when you click on a list item on the portfolio it directs you to a new page dedicated to that item. I want it to be that when you click on the link, a big popup (about half the screen) comes up that displays the contents.
Is there a way to make the page content into a popup? Is there a plugin I can use for this?
You can see what I am looking for in this site:http://www.mikekus.com/
When you click on the link for each item, it doesn't redirect you to a new page. A popup comes up with the page information. How can I do that on wordpress?
Thank you in advance for your assistance!
Here is what that site is running on: Dunked.
There are quite a few options out there for this, especially in the WordPress plugin area. One fairly barebones looking one is WP Post Popup which, as the name implies, turns your posts into modal pop-up's instead of a new page.
Not sure if there is anything out of the box that is comparable to popping up on the side like the page you linked. With some CSS work though you could probably make the one I linked above, or any of them for that matter, look as you would like.
If you want to try and make something on your own, I would recommend doing some reading up on modal windows.
I'm working on a website that is responsive for mobile. We want to be able to have a "full site" button when it's viewed on a mobile device so users can see the normal website without responsive styling.
I'm thinking on click of the "full site" button I can remove the media queries stylesheet. But that doesn't overwrite the viewport setting that I have:
And even if I could change the site at the click of a button, what happens when the user navigates to a new page?
Any ideas for the best way to handle this? Is it even possible? Thanks!
http://sunniebrook.com
There's this small blog post on css-tricks.com which I find pretty cool:
http://css-tricks.com/user-opt-out-responsive-design/
Which led me to this other blog post:
http://creativeandcode.com/responsive-view-full-site/
(Just put your wanted width in the meta viewport tag ;-) ).