not resolvedHi, I'm wondering if it's possible to create seperate blocks in the sidebar. This means the different blocks would look something like:
http://www.dikkevettecourgette.com
Right now the website with newscast is:
Where and how can I add the 'table' style for the blocks in the sidebar? This so I can add background colors to the table header/rows
Thanks!
Ismael
Moderator
Hello,
With the current layout of Newscast I think it will be difficult to replicate the layout of http://dikkevettecourgette.com/.
Regards,
Ismael
Thanks for the response, but I don't want to replicate (I know the styles are totally different).
But is there a way to create more discrepancy between the items in the sidebar?
For example by giving a background color to the widget headers? (In my case the 'Volg ons' etc. on http://bijvanatten.nl)
Or do you know another way to make more distinction between the different widgets in the sidebar?
Hi rwdroge,
What you would need to do is find the class name of the area you want to format then add a custom style to your custom.css or Quick CSS option in your theme options that targets that class name.
For example, on http://bijvanatten.nl you have the widget "Volg ons", "Nieuwsbrief", "@BijVanAtten", and "Populair". Now the words "Volg ons", "Nieuwsbrief", "@BijVanAtten", and "Populair" are considered the widget title and have the class name "widgettitle" applied to them. So if you wanted to change the background color of those you would add this CSS.
.widgettitle { background-color:#000000; }
What that does is tell the browser to set the background color of the widget title to black. You of course could change the color.
If you wanted to change the background color of the boxes you would have to locate the class name of the DIV, FORM or UL that surrounds the content. For example, "Volgs on" content has a DIV that surrounds them called "socialmedia-buttons" so in order to style that content I would use this.
.socialmedia-buttons { background-color:#EEEEEE; border:1px solid #CCCCCC; }
This would add a light grey background with a slightly darker grey border around the icons.
Now widget titles always use the same class name. The name you use for the content box is a bit trickier because each widget receives its own class or ID name depending on what it is. For instance, I used "socialmedia-buttons" for the "Volgs on" but the name for "Nieuwsbrief" iwould be "ns_widget_mailchimp_form-2". So you would have to look at the source code in order to find them.
To get you started, here's the class or ID names you would need to add to your custom CSS:
.socialmedia-buttons {
background-color: #000000;
}
#ns_widget_mailchimp_form-2 {
background-color: #000000;
}
.widget_twitter ul {
background-color: #000000;
}
.tw-tabs {
background-color: #000000;
}Hope this helps!
Regards,
Mya
Ok Mya, with your tips I made some progress. Still one issue remaining though.
As you can see on http://www.bijvanatten.nl the social media button box is well bordered without overlapping the border of the widget title.
Though the same code is used for the second and third box in the sidebar you can see that the right and left border are overlapping those borders of the widget title.
Any ideas?
You must log in to post.
Please start by registering an account for this forum here
Create a new thread and tell me what problems you are encountering and what you want to know.
There is no step 3 :)
We try to answer all questions within a day, monday-friday.
