Encounters Mobil responsiveness
Home › Forums › WordPress Themes – Premium › Encounters › Encounters Mobil responsiveness
- This topic has 10 replies, 37 voices, and was last updated 9 years, 7 months ago by
Julie.
-
AuthorPosts
-
June 13, 2013 at 5:18 pm #13850
Julie
ParticipantHi
I thought Encounters was mobile responsive? My site is not looking very good on iPad or iPhone? I noticed the Encounters Demo site is not appearing responsive either. Is there something I need to do to correct this?
Thanks,
Julie
June 13, 2013 at 5:24 pm #17907Sushil Adhikari
ModeratorHi Julie…. it should be responsive. What is the link to your site? Also, what parts are you finding are not responsive?
June 14, 2013 at 3:54 am #17910Julie
ParticipantIt is http://www.thebeautyisse.com
I currently have an under construction plugin activated but I will deactivate so you can view later today… But as I mention your demo site was behaving in the same way????
Thanks
June 14, 2013 at 3:55 am #17911Julie
ParticipantSorry typo… http://www.thebeautyissue.com
June 14, 2013 at 5:32 am #17912Sushil Adhikari
ModeratorHi Julie… thanks for the link, although I got to your coming soon page. Anyway, are you referring to the slider which I just noticed myself? That one I see not behaving, so this boy will be fixing this tonight and get this working correctly. Did you come across anything else not responsive?
June 14, 2013 at 10:02 am #17913Julie
ParticipantHi there
Well, it was my home page, the menu shifted one item down, which shifted the logo up. This was looking at it via iPad, but my sister took a look with iPhone and that was really all over the place… it looks great (even though not finished by a longshot)on all over devices such as my Macbook and iMac…
I have just deactivated the underconstruction plugin.. but I think it’s getting late where you are..
Thanks again
JulieJune 14, 2013 at 8:46 pm #17914Sushil Adhikari
ModeratorThere’s a couple little adjustments but please note that a responsive theme can be tested using this online tool: http://mattkersley.com/responsive/ which shows somethings needing the adjustments. However, there are other factors that determines when something in a page is to drop below as the browser window resizes, such as:
1. How big is the logo or site title
2. How big is the menu, a few or many menu items
3. Modifications or the type of content a user puts into a page…etc.Responsive is not a 100% smooth transition from super wide to really small because this is based on what is called Media queries where css is used to determine when to switch to a different style for adjustment based on the size of the window. It’s almost impossible to have it so that is adjusts on a per pixel-by-pixel basis, so media queries are done in batches of widths of minimum to maximum. This is usually a common set:
[code type=css]
/* Large desktop */
@media (min-width: 1200px) { … }/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) { … }/* Landscape phone to portrait tablet */
@media (max-width: 767px) { … }/* Landscape phones and down */
@media (max-width: 480px) { … }Now the only big problem is the padding you put on the showcase container which is very extreme. So this gave it a fixed oversized dimension which breaks the mobile view because normally the showcase should have a responsive slider or image and not to be used in the way you have used it. I would recommend replacing that with an image or slider that is responsive to solve one problem or put the text in a div container with an inline style of text-align: center. I looked at your site on my iphone and everything looked fine except that one issue.
Regarding the menu, it’s very difficult to judge what 1000’s of people will be using for a menu (as in how many menu links will be on it) because a theme has to try and accommodate most if not all but cannot really provide a true 100% gamut of responsiveness. But even though that site that displays a site in various window sizes doesn’t show one menu item dropping down, it does it when I manually shrink the browser. So my question for you is, does this happen to you on an ipad only, and were you viewing it in portrait or landscape?
However, based on everything so far , I have found some things that needs adjustments, including the Widgetkit slider on my demo site definitely needs some attention for responsiveness. I will be working on the adjustments today. Not sure how much I can do for your menu issue, but will try my best without sacrificing too much for others as well.
Unfortunately I do not have an ipad so I will have to rely on you to provide me feedback.
June 14, 2013 at 10:06 pm #17915Sushil Adhikari
ModeratorQuick update… I’ve been working on the changes needed, and so far it’s looking good, but I cannot do anything about your menu with the one item dropping down on the end. The size of your menu is sort of between the point of staying in normal mode and when it’s about to switch to the mobile view. This is where if you need it do stay or switch to the mobile menu at that point, then custom coding is required for your specific needs.
June 15, 2013 at 11:45 am #17916Julie
ParticipantHiya,
I fixed the showcase banner, the reason I changed it was because originally I did not realise I had the choice between banner and showcase. I have also limited my menu bar to 4 instead of 5 items.
Just changing those two things has seemed to fix the problem.
Just on the subject of the banner versus showcase, I have a question. How do I assign the banner and showcase to various pages? Or in some case not have it at all?
Thanks
Julie
June 15, 2013 at 6:49 pm #17917Sushil Adhikari
ModeratorHi Julie….first up, I actually uploaded a new version of Encounters which helps with some of the mobile styling on elements such as logo and menu to be centered on smaller screens. Anyway, to control/manage where widgets are shown, the plugin called Dynamic Widgets is what I use, which I have a video tutorial for that one.
https://www.styledthemes.com/encounters-theme-setup/133-how-to-publish-widgets-to-select-pages
So because the showcase and banner uses widgets as they are widget positions, the video will help you with this one.
June 27, 2013 at 5:32 pm #13851Julie
ParticipantHi again
Just checked out my showcase banner on iPad and text is far too big woth in the banner is far too big… Checked your demo site for Encounters Pro and doing and same problem? Is it my iPad 😛
Hope you can help…
Julie
-
AuthorPosts
- You must be logged in to reply to this topic.