How to Create Mobile Friendly WordPress Pages (Updated Version!)
HTML-код
- Опубликовано: 24 авг 2017
- How can you create mobile friendly and mobile responsive pages, blog posts and opt-in forms for your WordPress website? Follow these 8 steps to get perfect results each time.
Ensure your website is mobile-friendly TODAY → thrivethemes.com/architect?ut...
Watch how a conversion focused, mobile friendly website is built in under 1 hour: ruclips.net/video/CnbylVZt-Ig/видео.html
Tip #1: Use Images at Their Optimal Size
- 00:30
Tip #2: Show/Hide Elements for Inline Changes
- 3:17
Tip #3: Apply Responsive Style Changes
- 4:29
Tip #4: Use Alignments & Max Widths
- 8:50
Tip #5: Use Column Layouts Instead of Wrapping Text Around Images
- 12:52
Tip #6: Use the 20/10px Rule for Side Padding
- 14:32
Tip #7: Work from the Outside In
- 16:25
Tip #8: Work from Desktop to Phone (With 1 Exception)
- 18:00
Thank you for showing the neat Tap/ Click trick!
I'm watching those tutorials in my spare time and I can say it's the best time of my day. It's just beautiful!!!!
Shane, I'm in love with you man. I'm seriously a raving fan 1,000%. I bought ThriveThemes and have been selling everyone on it. Not only is it a MIRACLE product -- but holy shit -- you guys's tutorials & content sets the bar higher than anyone else. I just spent about a week straight building & designing my site, really customizing it... at the end I realized the mobile version looked like shit. Somewhat panicky I literally jump on and see this video uploaded just days ago -- and it was as if you were guiding me 1-on-1 with my exact issues. Now I suddenly find out about this "Architect" plugin?! Stoked. Looking forward to fixing my mobile site soon. Appreciate it man -- it'd be great to meet you someday -- I look up to you as an entrepreneur and you inspire me to push for greatness, quality, and just real, massive value. 😀😁
Hi, how much is this theme? thanx
a great tutorial, clear speech, clear instruction, much appreciated. Well done.
Well done Shane. Very clear, calm, and easy to comprehend. Learned more about how to build pages which is so great.
very professional
This is just perfect. Exactly what I needed. Thank you!
Perfect instruction, I really needed this. Much appreciated.
This tutorial is very well explained and very much helpful. Many thanks!
This is web page building gold for us noobs.
Thank you very much!
Fanatic tips! I'm so impressed with what Thrive Architect can do! You guys/gals really thought this thing through. I'm looking forward to building my first site (page) with it!!
Thank you, Lisa!
This is a fantastic video tutorial. Very helpful. I love learning from the master. Thrive content never disappoints.
Thank you, Len!
Thanks for very concrete and useful guidelines! Great video
Great info! Thanks
Thanks for the video.Good luck to you all !!
Why pay for Netflix when I have these awesome videos for free!
Best value per second on youtube! Keep them coming Shane!! :)
PS: Looooving Architect!!
Thank you!
This was a great tutorial, thank you!
Thanks, much appreciated.
This Instruction Video is simply perfect :D
I need this, thanks a lot 👍
THANK YOU!
Great Video!
good tip with the oversized images. i'm guilty of that. thanks!
Thanks Shane great tips as always. Must be the Irish in ya!
I don't see the connection, but thank you anyway. :)
Thanks,Very useful
This is a amazing video tutorial.
😍😍😍😍
Thank you, Omar!
Hey shane! thank you for the tutos. I've got to say that at the first time i hate thrive themes but now i love it!
Btw what software you use to record & edit videos? i really hope u answer please. or if anybody knows ill appreciate it
Excellent Presentation
Liked at Occam's Razor 👍
Great stuff! (Y)
good video post
Hi Shane, love Thrive Theme and the tutorials, however, the default themes are NOT automatically optimised for mobile phone view, and when i try to change settings it looks awful on mobile phone and it becomes extremely tedious as as process to try and get things right. With a previous plug in i used the templates were automatically controverted for mobile phone view, is there something I am missing out? like...a button i should click or something?
which editor is this? I can't figure out how to get 3 columns instead of one for mobile. Elementor won't work for me!
So basically, there is no free version for this plugin?
Melaugh... why u not laugh? Huh? Good stuff.
hi, which web builder you are using for that? Is that elementor
Great tutorial Shane! One thing I wonder though is that most of the visual builders such as yours do not account for mobile layouts in landscape mode. How can we address this and prepare the layouts in the event that someone will view in landscape mode on their phone or tablet?
Hello Alain,
Thank you for your comment!
We do account for screens in landscape mode, just as we account for the thousands of screen sizes that aren't selectable or previewable directly in the editor. Think of the "desktop", "tablet" and "mobile" views simply as 3 anchor points. If you optimize your content for all 3, it will look good on the thousands of possible screen dimensions in between.
Why don't we have a tablet-landscape and phone-landscape button? Because if you look at content on a phone in landscape mode, the width is pretty much the same as a tablet in portrait mode. And a tablet in landscape mode is pretty much the same as a small laptop screen. Adding break points and optimization for many steps in between just adds more code to the page and more steps to the workflow, without adding much benefit.
That did not work for me. Any changes I made i one form, changed in all others. I even called wordpress live to try and see if I was missing something. There is a some sort of glitch in the system.
The entire page on the mobile terminal can be slid left and right, all elements have been checked, no problems were found, and I don’t know how to deal with it
Would be nice to be able to toggle all design tabs on the left sidebar (options/typography/layout/background/etc.) - right now if you have a few of them open, it takes too long to get to the bottom tabs
also - in columns -> columns options, the "reverse order" option does not work in mobile views, when the columns are placed on top of each other, meaning, the left column is always on top
Thanks for your feedback, Russell. If you check "reverse order" in the desktop view, it works. I'm not sure if this is something we can improve, I have to ask the developers. Right now, the workflow I use is that I create the columns and sizing in normal order, then hit "reverse" and add the content. Doing this, it will stack correctly on smaller screens.
I want this theme
On thrive content builder, everything is on the right hand side. Is there any way to put all of the tools ect, everything on the right hand side on thrive architect? I am used to everything being on the right when building a page.
Yes, you can click on the "settings" icon in the top left (the gear icon). There, you'll find the option to switch the editor to the other side.
Hi Shane, I saw someone yesterday mention a bug in architect, wondering if it's been ironed out yet before I update from tcb1.0 to architect...
Hi James,
We've done daily bug fix releases since we delivered the plugin to members, so it's possible that it was fixed. Can you tell me what bug you are referring to?
it was a bug where some big blue box obscured the view within architect as the lady was building a page. I saw the reply (from Shane I think) that said "probably a bug, let us have a look into that)...Not even sure where I saw this, probably on the thrive website yesterday (or the day before).
Ah yes, that was an issue with some themes that caused icons in our builder to be displayed at a very large size. We already fixed that. :)
Cool, will go ahead and update all my thrive stuff now! Thanks!
Thanks Shane...
Is it a free plugin?
Good info, but what happen to the Thrive Click to Call feature that we had before. I build a lot for mobile and I need that feature.
Hi Greg,
The click-to-call is a theme shortcode that was previously displayed in the elements list as well. You can still use it as before, but you need to insert it as a WordPress Content element, now.
How do I do that? I found the wordpress content but how do I get the click to call? What is the short code and how do I find it.
Here's a screenshot of how to find it: cl.ly/3M3X3z2Z2D2u
We will bring the click to call element back as something that's easier to create and add than through the WordPress Element. Sorry for the inconvenience, in the meantime.
We've just published a new tutorial to explain the new click to call in Thrive Architect: ruclips.net/video/H4sYXoigPCM/видео.html
I have been making changes in Mobile View in Elementor and its gets changed easily. But when i update the site, i cannot see the same layout in my phone. Why is this hapenning?? PLEASE HELP
Because this is a video about Thrive Architect... You should ask help from Elementor
appliance.academy
you are too complicated
Very true some theme allows this work automatically but here we need to do by our own take a lot of time and we need to change everything ...