Twenty Twelve changes

  • Unknown's avatar
    cwwhwest · Member ·

    Hello,

    I apologize for the amount of requests I have made…I have a lot of changes to make because when I renewed my website today all of the formatting I had made over the past year was completely wiped out.

    Therefore, I have questions for how to make the following changes for the website: westernwomenshistory.org It is a Twenty Twelve theme.

    1. Move the menu underneath the header image

    2. Header image: decrease the margins (white margins) so that the hearder image and menu blend right into the background color (the light taupe-ish color) and that there isn’t any white space between them.

    3. Change the menu font color to black

    4. Change the “submenu” (the menu items that off-shoot from the drop-down menu items) color to something lighter so that it doesn’t blend in with the drop-down menu items.

    5. Delete the “menu heading” on each page so that I don’t see “Home” at the top of the “Home Page”

    6. Decrease the amount of white space between the beginning of the text on each page and the items directly above it.

    7. Change the order of items that appear on the menu. For example, put “About Us” after “Home” and put “Donors” over at the far right of the menu, etc.

    The blog I need help with is: (visible only to logged in users)

  • staff-happychia · Staff ·

    [1] 

    header#masthead {
    position:relative;
}

nav#site-navigation {
    top:205px;
    position:absolute;
    padding-right: 90px;
}

img.header-image {
    position: absolute;
}

#main {
    margin-top: 120px
}

    [2] Covered in [1] above.

    [3] 

    .main-navigation li a,
.main-navigation .current-menu-item > a, .main-navigation .current-menu-ancestor > a, .main-navigation .current_page_item > a, .main-navigation .current_page_ancestor > a {
color: #000;
}

    [4] This happens if you hover over submenu items. Do you mean you want the separator as soon as the menu drops down?

    [5] 

    .page .entry-header .entry-title {
    display:none;
}

    [6] Covered in [1] above.

    [7] You can change the order of menu items by rearranging them from the Appearance > Menus > Select a menu to edit > Menu Structure section.

  • Unknown's avatar
    cwwhwest · Member ·

    Thank you so so much. This is incredibly helpful.

    To answer your question regarding #4: Yes, I would like the separator as soon as the “sub-menu” drop-down appears. For example, if you go to “Awards & Prizes” and hover over “Irene Ledesma Prize” the menu that off-shoots (“Prize Call” and “Recipients”) from there is the same color as the main drop down menu. Is there any possible way to change the color of the off-shoot drop-down menu items?

    Also, is there any way to decrease the “side margins” of white space? This is described above in #2, but now I am specifically referring to decreasing the side margins (left/right).

    Finally…I would like to increase the font sizes of the site title and site description, make sure both the title and description appear in black, and italicize the site description.

    Again, thank you so much for your help.

  • Unknown's avatar
    designsimply · Member ·

    when I renewed my website today all of the formatting I had made over the past year was completely wiped out

    CSS revisions are stored, and you should be able to find them by clicking the “CSS Revisions” link just above the editor in the Appearance > Customize > CSS panel. Sorry I didn’t see your request sooner or you may have been able to just find and use the older revisions. Also, renewing should not wipe out CSS changes unless you also changed themes.

  • Unknown's avatar
    designsimply · Member ·

    To answer your question regarding #4: Yes, I would like the separator as soon as the “sub-menu” drop-down appears. For example, if you go to “Awards & Prizes” and hover over “Irene Ledesma Prize” the menu that off-shoots (“Prize Call” and “Recipients”) from there is the same color as the main drop down menu. Is there any possible way to change the color of the off-shoot drop-down menu items?

    .main-navigation li ul ul li a {
	background: #ff0;
	border-bottom: 1px solid #ff0;
}

    Change the color codes as needed.

  • Unknown's avatar
    designsimply · Member ·

    Also, is there any way to decrease the “side margins” of white space? This is described above in #2, but now I am specifically referring to decreasing the side margins (left/right).

    If you just get rid of the padding on the main content container, it will look odd because all the other content will not have enough white space around it:

    body .site {
	padding: 0;
}

    You could try to get around that problem by manually changing the inner container elements and adding back some padding for them. Here is a snippet to get you started:

    hgroup,
.site-content {
	margin: 0 40px;
}

body.full-width .site-content {
	width: auto;
}

    You can also review this page to learn how to find CSS selectors on your own if you find that you need to adjust any additional inner content areas:
    http://en.support.wordpress.com/custom-design/how-to-find-your-themes-css/

  • Unknown's avatar
    designsimply · Member ·

    Finally…I would like to increase the font sizes of the site title and site description, make sure both the title and description appear in black, and italicize the site description.

    Let me show you how to use the web inspector in Firefox to find CSS selectors and test out new CSS:

    https://cloudup.com/cyckBaR6lGq (1m50s)

    Here is the result from the screencast:

    .site-header h1 a {
  color: black;
  font-size: 2em;
}

.site-header h2 {
  color: black;
  font-size: 1.3em;
  font-style: italic;
}
  • The topic ‘Twenty Twelve changes’ is closed to new replies.