A few newbie questions…

  • Hi,

    I have a few questions I am hoping you can help me out with… hope they make sense!

    I have added my own image in the header of my blog by inserting the URL of an image from google (I wanted a more specific image) and have edited the code in the CSS to say that the image is to be repeated in the header. My question is – what dimensions (width, height etc) convention should I follow to ensure that the header lines up properly with the background and the border? My border/lines around the header no longer line up properly and look ‘out of place’. I have tried several different combinations of width, height etc but still unable to fix it.

    -How do I make the blog header/title text bold?

    -How do I change the colour of the additional pages I have added to the top navigation bar? They are currently in white and for some reason not easily viewable – how do I change the colour of the page title e.g. I may have a page called test 1 and test 2 how do I change the colour of these??

    Thanks in advance.

Viewing 10 replies - 1 through 10 (of 10 total)

  • link?

    theme?

    display issues are best checked with a link to the live site.

    Thread Starter yusuf123

    (@yusuf123)

    Hi,

    Sorry about that, here is the link to the site:

    https://www.the-wedding-page.com

    and I think the theme is Morning Due.

    Thanks.

    make a backup copy before editing

    you have a lot of different widths for the divs;
    to harmonize them, change the width as follows:
    (find the place where the style is defined and edit the width; in style.css of the theme)

    #header { width: 940px;}
#logo { width: 975px;}
#page { width: 940px;}

    header title bold:

    #logo h1 {
	padding: 25px 0 0 0;
	letter-spacing: -1px;
	text-transform: sentencecase;
	font-weight: normal; /* change to bold */
	font-size: 4.8em;
}

#logo p {
	text-transform: sentencecase;
	padding: 4px 0 0 3px;
	font-family: Georgia, "Times New Roman", Times, serif, bold;
	font-size: 22px;
	color: #E4287C;
 font-weight:bold; /* add this */
}

    the color of the page nav:

    #menu a {
	height: 30px;
	margin: 0;
	padding: 20px 30px 0 30px;
	background: url(images/img06.gif) no-repeat left 24px;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif, bold;
	font-size: 13px;
	font-weight: normal;
	color: #E4287C;
}

#menu a:hover {
	color: #FFDEDE;
}

#menu .current_page_item a {
	background: none;
	color: #FFDEDE;
}

    adapt and use your own color codes.

    good luck ??

    Thread Starter yusuf123

    (@yusuf123)

    Hi,

    I tried the code you provided but it didnt make any difference? Not sure if I’m doing something wrong…? Is there any way I can post my code here/Private message you so you can see what exactly I have done and what needs to be changed?

    Thank you.

    any style css is available from the link that you posted.
    and i don’t think this is a php code issue.

    to post larger amount of code, you can copy your code into a https://wordpress.pastebin.com/ and post the link to it here.

    changes in the css often get visible only after refreshing the browser cache (press CTRL and F5 at the same time; or press reload at the browser).

    Thread Starter yusuf123

    (@yusuf123)

    Hi,

    Yes, I did refresh the page but still no change, I think the header text has changed to bold but the page titles havent changed colour and neither has the header lined up.

    Here is the link to my full code, really appreciate your assistance.

    https://wordpress.pastebin.com/aPXGMXLR

    Thanks.

    adapt and use your own color codes.

    did you put new color codes into the styles?
    i can’t see them in your style.css.
    for instance, you can find color codes here https://en.wikipedia.org/wiki/Web_colors

    also, you did not change the width of #page:
    #page { width: 940px;}

    Thread Starter yusuf123

    (@yusuf123)

    Hi,

    I have now changed the width to 940px:
    #page {
    width: 940px;

    This change has again made no difference to the header or the alignment. Could it be that I am using a custom image and not a wordpress header?

    I still dont know where I should change the colour code so the colour of my page headers/titles is more visible.

    Sorry for being such a pain!

    Thank you.

    btw: the alignment seems to be ok now, however i can’t know what you would like to have.

    the rest has very little to do with wordpress.
    just basic css adaptations – and you already have all the styles to look for.
    there are online resources available to brush-up on your knowledge of css and html:
    https://www.w3schools.com/css/css_colornames.asp
    https://www.w3schools.com/css/css_text.asp
    and the whole w3schools.com

    here again, from the style.css, the style that influence the link colors:

    #menu a {
	height: 30px;
	margin: 0;
	padding: 20px 30px 0 30px;
	background: url(images/img06.gif) no-repeat left 24px;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif, bold;
	font-size: 13px;
	font-weight: normal;
	color: #E4287C;
}

#menu a:hover {
	color: #FFDEDE;
}

#menu .current_page_item a {
	background: none;
	color: #FFDEDE;
}

    the lines that begin with ‘color’ – and again – you have to find color codes that you want to show in your design.
    you have (unfortunately) make an effort to follow the links provided and start learning …

    Thread Starter yusuf123

    (@yusuf123)

    Hi,
    Thanks for response.

    The header does align but the colour scheme behind doesnt…. I think this is something (like you say) that isnt a WordPress issue. I will have a look at the resourses provided to educate myself!

    The colours of the page headers have now changed. Thank you.

    Thanks for all your help.

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘A few newbie questions…’ is closed to new replies.