Customising Agency Theme

[dancrofts]

Hi guys,

New user here. I've been playing around with customising the Agency theme and so far everything has been (for the most part) extremely easy and intuitive, massive props for that!

I do have a few styling issues that I just cannot figure out though and would appreciate any help with them. My website is: http://dancrofts.com/about/ (homepage currently not active).

1. How can I get the primary menu navigation centered? I've been playing around with the CSS for hours and no luck. I believe the div is "ul.menu.genesis-nav-menu.menu-primary.superfish.sf-js-enabled".

2. With the Jetpack sharing buttons on my blog, what is the best way to customise the css? If I update the sharing.css file from the plugin, I will lose all my changes when it's updated. I'm a bit of a newbie when it comes to WordPress, so don't know what the best practice is. (See http://dancrofts.com/threaded-comments/ - sharing buttons are above and below the post).

3. How can I add a page that mimics the homepage of the Agency theme demo? (I have the Genesis Responsive Slider plugin installed). For that matter, what is the homepage actually called? I can't find a Home or Index page under the Pages tab.

Thanks very much in advance for the help!

Kind Regards
Dan Crofts

[Pinky]

Hey Dan

i find the best way to make css changes are with a plugin My Custom CSS.

Anything you put in there will over-ride plugin css, theme css etc. Plus you can see all your changes in one place.

Here's the page with the instructions on how to setup the theme like the demo:
http://my.studiopress.com/setup/agency-theme/

To center the navigation you can try the suggestions on this page:

http://journalxtra.com/easyguides/howto-center-wordpress-genesis-theme-horizontal-menus-4729/

---

cheers

Pinky

[dancrofts]

Thanks Pinky! I'm now using the My Custom CSS plugin to edit the CSS of the sharing buttons.

I used the CSS from that page you linked to center the navigation, but the menu didn't remain mobile responsive. I actually found a much easier solution:

<code>

.menu-primary li,
.menu-secondary li,
#header .menu li {
float: none;
display: inline-block;
list-style-type: none;
text-transform: uppercase;
}

</code>

The key here was display: inline-block. Funnily enough, this is already in Agency's CSS when the screen width goes less than 960px (I just happened to resize the browser and notice the menu center itself. Couldn't believe it!)

I'll go through the instructions as per your recommendation and setup the site.

Thanks very much!

[Pinky]

hey Dan

Thanks for the help to you too... I'll be trying out that bit of code myself!

---

cheers

Pinky

[IoPT]

Hi Dan,

To answer #3, the Agency theme constructs the home page dynamically.  When I first set it up I created a static page and tried the different templates and never got it to work.  Then I used the contact help form and received instructions:
Go to Settings -> Reading and pick "your latest posts".
Also make sure the blog page setting has no page selected.
Then I had to go back to my menu and remove the page name so that "Home" pointed to the bare domain name (as yours does now).  Then it was a matter of installing the Responsive Slider plug-in and going to the Widget page and filing in the different sections of the page.  Featured Page widgets in Home L-M-R, welcome text in Home Welcome, etc.
I'm still working on getting mine to look and function properly.  I'm having some issues (which I'll post in a separate thread) so this is by no means close to live:  http://ioptconsulting.com

[Author]

Posts