css help for Edin theme

ybaileche · Member · Sep 28, 2015 at 5:29 pm
Copy link

Add topic to favorites
Hello,

I need help with css customization for the Edin them with the following:
– Reduce size of the sidebar – The size is 300 pixels but I would like to have it smaller – I use alternate sidebars on the site

– Site title on front page – make text smaller

– Textera in contact form – Reduce height of the comment box in page and widget

Thanks
timethief · Member · Sep 28, 2015 at 8:24 pm
Copy link
CSS editing is theme specific editing. Volunteers cannot view private blogs and we Volunteers do not request access to them. Staff can view private blog content and this thread is tagged for their assistance. Please be patient while waiting for a response and subscribe to this thread so you are notified when they respond. To subscribe look in the sidebar of this thread, find the subscribe to topics link and click it.
thesacredpath · Member · Sep 29, 2015 at 4:28 am
Copy link
Hi @ybaileche, to change the items you mention, you will need the WordPress.com Premium plan upgrade, which has the Custom Design Feature.

You can try out and preview custom CSS before you buy as explained here.

The following will allow you to change the width of the widget area and the main content area. I would suggest adding the same amount to the content area as you take away from the widget area. The width values shown are the original values.
```
.content-area {
    width: 540px;
}
.widget-area {
    width: 300px;
}
```
To change the size of the site title, this would be the CSS. Again the value shown is the original size.
```
.site-title {
    font-size: 2.25em;
}
```
You can preview the changes in the customizer and even save the CSS, but to have it applied to your actual site, you will need the upgrade.
ybaileche · Member · Sep 29, 2015 at 1:38 pm
Copy link
This is great. Thank you

Any ways I can reduce the height of the comment box in contact forms ?
thesacredpath · Member · Sep 29, 2015 at 7:37 pm
Copy link
Sure, to change the height of the text box on the contact form, add this to your CSS and adjust as desired.
```
.contact-form textarea {
    height: 200px;
}
```
ybaileche · Member · Sep 30, 2015 at 10:20 am
Copy link
Thanks again.

One last thing – I would like to add more space between the site title and the navigation bar
thesacredpath · Member · Sep 30, 2015 at 6:51 pm
Copy link
To add more space between the site title and navigation, add the following and adjust as desired.
```
.navigation-classic .primary-navigation {
    margin-top: 20px;
}
```
ybaileche · Member · Oct 7, 2015 at 3:41 pm
Copy link
Thank you!
ybaileche · Member · Nov 8, 2015 at 6:43 pm
Copy link
Hello,

I also would like to change the following:

– Move the titles of the featured pages of the homepage above the images.
– Add space between the featured image and the featured pages on the homepage

Thank you

The blog I need help with is http://www.missionphysique.com
daisyfitz · Member · Nov 9, 2015 at 1:02 pm
Copy link
Is there a way to remove the bolding on the Classic Menu, please?
thesacredpath · Member · Nov 9, 2015 at 9:57 pm
Copy link
To make the menu text normal instead of bold, add the following CSS.
```
.primary-navigation .menu-primary a {
    font-weight: normal;
}
```
ybaileche · Member · Nov 10, 2015 at 12:40 am
Copy link
Is is possible to do the following, please ?

– Move the titles of the featured pages of the homepage above the images.
– Add space between the featured image and the featured pages on the homepage

Thanks
thesacredpath · Member · Nov 10, 2015 at 6:04 am
Copy link
Hi, give the following a try, but due to us having to use position absolute to move the title above the image, if your title gets too long, it will overlay the top of the image since position absolute floats the element freely above the other elements and it loses its relationship to the other elements. By using position relative on the .hentry (first rule) I am able to limit the title to the bounds of that element.
```
.home .featured-page-area .hentry {
    position: relative;
}
.home .featured-page-area .hentry .entry-title {
    position: absolute;
    top: 0;
}
.home .featured-page-area .post-thumbnail {
    padding-top: 45px;
}
.home .featured-page-area .hentry .entry-title {
    width: 100%;
}
```
Make sure and view it in a phone and tablet if you can to make sure nothing goes awry. It looks to me that it is all good, but it never hurts to have some confirmation.
ybaileche · Member · Nov 10, 2015 at 2:21 pm
Copy link
That worked.. Thank you :-)
thesacredpath · Member · Nov 10, 2015 at 7:17 pm
Copy link
Hooray and you are welcome.

No items found.