sidebar issue

Post Reply
Laurent
Jr. Bludit
Posts: 7
Joined: Sat Nov 27, 2021 1:49 pm

Hi all,

I am discovering Bludit little by little and I did so modifications on the default theme "blogx" to personalize it .
But I have a little thing I don't find solution : it's about the sidebar.
I could do some changes. Per example, I did in way that the text is aligned to right. Tags are in smaller size and in inline way. The menu categories a bit bigger.
It was rather simple by some hacks on PHP files and CSS.

But, I would like all this plug-ins on the sidebar are in inline way and text centred when we look the site in responsive mode (@media max-width:768px)... and I don't find out how to do that. I try many ways, but no one worked.

So, if some body has solution, it would be welcome.

PS I hope my message is understandable.
Laurent
Jr. Bludit
Posts: 7
Joined: Sat Nov 27, 2021 1:49 pm

Hi again,

I found out. I needed to modify also the file "index.php" of the theme.

Stupid I am.
User avatar
Edi
Site Admin
Posts: 2592
Joined: Sun Aug 09, 2015 5:01 pm
Location: Zurich
Contact:

Laurent wrote: Wed Dec 01, 2021 9:17 am But, I would like all this plug-ins on the sidebar are in inline way and text centred when we look the site in responsive mode (@media max-width:768px)... and I don't find out how to do that.
You can give the class of the sidebar the following rules for the media query:

Code: Select all

@media (max-width: 768px) {

   .col-md-3 {
      display: inline;
      text-align: center;
   }

}

Perhaps I do not understand your question....
Gumroad - Useful plugins for Bludit | Nützliche Plugins für Bludit
Planet-Bludit - Tipps, Snippets und hilfreiche Links (auf Deutsch)
Laurent
Jr. Bludit
Posts: 7
Joined: Sat Nov 27, 2021 1:49 pm

Thank Edi,

You understood right.
The only difference, it's I put my own div class because I like to use my own CSS file. I can modify more easily like I want (and I don't want to do any changes in the bootstrap.css).

So, I hack the index.php and and change as

Code: Select all

<div class="col-md-3 site-sidebar">
And in my CSS file I did about like you write

Code: Select all

@media (max-width: 768px) {

   .site-sidebar {
      display: inline;
      text-align: center;
   }

}
It works like I want.
Post Reply