Hello, I have decided to use the left sidebar in the theme which looks good on desktop but with mobile, the sidebar shows before the post itself. meaning visitors will have to scroll through the sidebar before seeing a post. how do i solve this issue. meanwhile when the right sidebar is active, everything is back to normal. i need help. site is loudsoundgh.com
Hi
This is the theme implementation foe the left sidebar, on mobile devices the sidebar will be displayed first then the post content. To change that implementation you have to edit the single template file corresponding with the post template used and move the indicated code like here: http://screencast.com/t/YirDzAiA5 Also you will need this css in theme panel > custom code > custom css:
.single .td-pb-row [class*="td-pb-span"]{
float: right;
}
Depending by the post template used you may need additional css customization.
Thanks!
Im a bit confused… If you say “MOVE” do you mean I will clear those you highlighted? I have little knowledge on coding so I will appreciate if you can use simple terms with probably step by step instructions to get this done. Thank you
Hi
You need to move the code like here: http://screencast.com/t/g1IYyeMwcLt3 – http://screencast.com/t/zw525yRNv
Thanks!
Done moving the code but i get errors when i fix the custom CSS…This is a screenshot >>> http://www.screencast.com/t/KDLOBYnsvSdA
Hi
That is not an error,l it is an warning that the selector it’s a bit slower. You can replace the inprevious css with this one, which is more specific and the warning will disappear:
.td-pb-span8.td-main-content{
float: right;
}
Thanks!
I went through all those steps that you indicated, but the sidebar still shows up first on mobile. When I implement the first custom css code you gave (the slow one), it had the opposite effect on my desktop version, and no effect on mobile. When I implemented the second custom css code, it had no effect on my mobile or desktop version. Any help please?
Hi
The above solution works fine but you have to do the steps in a very precise order. Firs make sure you edit the right file, then move the indicated php code and finally apply last css code.
My example refers to post template 5 but if you’re using different post templates you have to modify the files corresponding with them.
Thanks!
Hey Andrei, I think that I know what the issue is. I use the default – post template 1, how could I change the code to fix the sidebar problem for post template 1? Thanks.
Hi
Basically you have to edit single-template-1.php and apply the changes indicated above. I’ve made a quick test and it seems that they work fine: http://screencast.com/t/9K97MImgeUf – http://screencast.com/t/jE2or7zJXVFe
Thanks!
Thank you so so much Andrei! You’re a life saver lol.
Damn… Nevermind. It works for some articles but not for others (same template). I guess I’ll wait until you guys add it in as a feature?
