- This topic has 6 replies, 2 voices, and was last updated 10 years, 4 months ago by Tim.
-
AuthorPosts
-
May 13, 2014 at 7:05 pm #30407TimMember
Hello,
I was hoping that by choosing a left sidebar, the sidebar would show up before the page content on a mobile device. Instead, it still shows up after the page content.
Is there a way to have the sidebar information show before the page content on a mobile device?
Thanks.
May 13, 2014 at 10:38 pm #30435SakinKeymaster@Tim: Sorry this option in not there. As in general user have most priority information in Content Section. So, we load the content first and sidebar second.
At this stage, you can build child theme and then add “Sidebar First Page Template” in your child theme as page-sidebar-first.php. See the code https://gist.github.com/catchthemes/b1b0f49a48c8e9b84fd0
Then in your page you can select Left Sidebar and in Page template you can choose “Sidebar First Template” and add the following css in child theme style.css
.left-sidebar #primary { clear: none; }
This is bit technical answer. I hope you understand it.
May 14, 2014 at 2:29 am #30470TimMember@Sakin–
Awesome! Seemed to have worked perfectly.One thing that doesn’t still show right is, in part due to me, the text in the boxes. BTW, I’m using the text/html widget in the sidebar to highlight services. That is why I want them to show first on the mobile device.
Anyway, I had modified the style with
.textwidget ul { list-style-type: disc; }
On a big screen, the bullets show fine. On my iPhone, the bullets show outside the box. Is this simple for me to fix?
Tim
May 14, 2014 at 10:54 am #30505SakinKeymaster@Tim: Send me the link where you want to fix it. I will send you custom css.
May 14, 2014 at 6:24 pm #30587TimMember@Sakin,
This is the specific page: https://www.itstechnical.net/?page_id=68
And here is the custom css I added to turn the bullets back on:
.textwidget ul { list-style-type: disc; }
Thanks!
May 14, 2014 at 8:18 pm #30600SakinKeymaster@Tim: Either you need to add in padding as below:
.textwidget ul { list-style: disc; padding-left: 11px; }
Or you need to make the disc inside in bullet as below:
.textwidget ul { list-style: disc inside; }
May 15, 2014 at 9:30 am #30726TimMemberThanks. I preferred the former as it left the text aligned better.
-
AuthorPosts
- The topic ‘Sidebar/Page Order on mobile devices’ is closed to new replies.