Hi. how can i change color and size sidebar ..??

This topic has 15 replies, 4 voices, and was last updated 10 years by Abe.

Author
March 24, 2014 at 20:18 #13378

Joss
Participant

I have tried to change the color and size of the sidebar but i dont now how
can someone hekp me …?
March 27, 2014 at 15:36 #13590

Abe
Keymaster
Hi Joss,
To change the sidebar width we have done some changes to the theme and now you will have two new options in Theme options – Layout settings to set content width: “Main content width for one sidebar templates” and “Main content width for two sidebars templates”.
Until next update please get this archive and replace current theme files with the one included in the archive.
https://archived.seventhqueen.com/files/kleo/kleo-template-width.zip

To change the colors for the sidebar you need to add custom css in the file kleo-child/style.css or in admin – Theme options – Quick css for example:
COPY CODE
```
.sidebar {
    background: none repeat scroll 0 0 #CCCCCC;
    color: #0000FF !important;
}
.sidebar a{
    color: #0000FF !important;
}
.widget-title {
    color: #FF0000 !important;
}
```
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.
May 5, 2014 at 17:38 #16917

robblundell
Participant

Hi,

The background colour of my sidebar did not change when I did this. are you sure the sidebar background is correct?

May 6, 2014 at 19:34 #16988

robblundell
Participant

This reply has been set as private.

May 9, 2014 at 23:55 #17355

Abe
Keymaster

adding the CSS should work, just change the color codes to your desired ones

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

May 10, 2014 at 07:05 #17415

robblundell
Participant

Hi

I have the following on http://www.sugrandspice.com/spice

.sidebar {
background: none repeat scroll 0 0 #000000;
color: #0000FF !important;
}

and the sidebar is still white.

Please advise.

May 10, 2014 at 08:43 #17420

robblundell
Participant

This reply has been set as private.

May 11, 2014 at 00:00 #17497

SQadmin
Keymaster

Hi @robblundell, in a few moments I’ll give you the full css for this.

Regards,
Robert

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution
May 11, 2014 at 00:27 #17501

SQadmin
Keymaster
Hi, as you know if you change sidebar background apart from the rest of the layout you also need to change colors, backgrounds, lines, etc. on some elements to fit in the same color palette. I added these lines as an example of what you need, you can change hex colors as you need.
COPY CODE
```
.sidebar {
	background: #000;
}
.sidebar a {
    color: #777 !important;
}
.widget_search #searchform > div,
.sidebar select {
	border-color: #333 !important;
}

.sidebar .kleo-widget-recent-posts-li,
.sidebar .widget_categories li,
.sidebar .widget_recent_entries li,
.sidebar .widget_archive li,
.sidebar .widget_display_views li,
.sidebar .widget_recent_comments li,
.sidebar .widget_product_categories li,
.sidebar .widget_layered_nav li,
.sidebar .widget_nav_menu a,
.widget_tag_cloud a {
	border-color: #333 !important;
}
.sidebar .widget_nav_menu .current_page_item > a,
.widget_tag_cloud a {
	background-color: #272727 !important;
}

Regards,
Robert
```
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution
May 12, 2014 at 04:54 #17537

robblundell
Participant

This reply has been set as private.

May 12, 2014 at 04:55 #17538

robblundell
Participant

This is for the Sweetdate theme as well. It isn’t for the Kleo theme.

May 14, 2014 at 02:08 #17783

Abe
Keymaster

@robblundell this topic is for KLEO, please create a different topic in the right theme section

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

May 14, 2014 at 02:09 #17785

Abe
Keymaster

PS: @robblundell in Sweetdate – Styling options you have the sidebar section where you can style it

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

May 14, 2014 at 08:37 #17815

robblundell
Participant

@abe there is no styling options for sidebar background – Can you advise how and where i change this?

Attachments:
You must be logged in to view attached files.

May 14, 2014 at 16:49 #17859

robblundell
Participant

Hi,

I have implemented this. Please see attached, and this has had no effect on my sidebar.

I also tried it as a class and id but it didn’t work either.

Attachments:
You must be logged in to view attached files.

May 14, 2014 at 17:01 #17865

Abe
Keymaster

This is a KLEO topic but my code is for Sweetdate. Please create a new topic in Sweetdate theme. We will close this section. Also share a link to your site

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.
Author

Posts