Viewing 17 posts - 1 through 17 (of 17 total)
  • Author
    Posts
  • February 24, 2015 at 3:46 pm #401469
    josephhunterdesign

    Hi,
    I am using this theme for a client. They want some changes done within the header that I am not seeing how to go about.
    Any input would be great!

    Here is a list of what the want to be able to do as well as a link to an image depicting these changes.
    https://www.dropbox.com/s/lbwnmltmuw4gydk/site_header_Mock.jpg?dl=0

    1. Logo in left corner with navigation centered below.
    2. background behind navigation different color then header background color
    3. Image in the top right of the header. This would need to be a clickable link.
    4. Phone number next to the image. With it being large and italic.

    If you can offer any assistance it would be greatly appreciated.

    February 25, 2015 at 4:01 pm #402112
    Josue

    Hey!

    2. Try using the Advanced Style Editor to change the main menu section appareance.
    3. Add this to theme / child theme functions.php

    function av_change_logo($logo, $use_image, $headline_type, $sub, $alt, $link){
       $logo .= "<div class='custom_content'>NUMBER AND IMG HERE</div>";
	return $logo;
}
add_filter('avf_logo_final_output', 'av_change_logo', 100, 6);

    And this to Quick CSS:

    .custom_content {
    right: 0;
    position: absolute;
}

    Cheers!
    Josue

    February 26, 2015 at 3:24 pm #402710
    josephhunterdesign
    This reply has been marked as private.
    February 26, 2015 at 3:27 pm #402713
    Yigit

    Hey!

    Yes, you can go to Appearance > Editor and open Functions.php file and paste it there. It does not matter where you paste it.

    Cheers!
    Yigit

    February 26, 2015 at 3:40 pm #402726
    josephhunterdesign
    This reply has been marked as private.
    February 26, 2015 at 3:43 pm #402729
    Yigit

    Hey!

    Via FTP please go to wp-content/themes/enfold folder and undo the changes you have made on Functions.php file and post the code you tried to add here using – http://pastebin.com/ so we can add it for you :)

    Best regards,
    Yigit

    February 26, 2015 at 3:44 pm #402730
    josephhunterdesign

    Crisis, averted… I just re-uploaded the functions.php file via the ftp and overwrote the messed up one.

    so I do this to functions-enfold.php or Theme Functions (functions.php)?

    February 26, 2015 at 3:56 pm #402738
    Yigit

    Hey!

    I would do the changes for you but seems like you have already added custom content to header?

    Best regards,
    Yigit

    February 26, 2015 at 4:01 pm #402744
    josephhunterdesign

    I did! Sorry about that. I added the php to functions-enfold.php and the css to quick css as you stated.

    My next questions is how do I go about styling the text for the phone number and adding the image? I would like the font to be larger and italic and I created a placeholder image that is located at http://www.mach1racingschools.net/wp-content/uploads/2015/02/img_plchldr.jpg

    Do I make these edits within the DIV in that chunk of php that I just added? Or in the css?

    February 26, 2015 at 4:09 pm #402749
    Yigit

    Hi!

    Please add following code to Quick CSS and adjust as needed

    .custom_content img {
max-width: 24%;
}
span.header-text {
color: red;
font-size: 20px;
position: relative;
top: -30px;
right: 10px;
}

    I moved the code to Functions.php file. Please find it and change external link and link to your image.

    Regards,
    Yigit

    February 27, 2015 at 3:20 pm #403442
    josephhunterdesign

    This is starting to look great.

    Just a few more questions.
    1. You told me to edited to color of the nav area with the advnaced styling options, which i did, but it only makes the menu itmes red and not the whole nav area. Any idea on how to fix that?

    2. How can I move the image and phone number in the header closer to the right side? I’d like it to be the same distance from the edge as the logo.

    3. Can I make it so that when this loads on a phone the car image in the header disappears and the phone number shrinks in size?

    February 27, 2015 at 3:27 pm #403447
    Yigit

    Hi!

    Please add following code to Quick CSS 

    div#header_main_alternate {
background-color: #ff0000;
}
.custom_content {
right: -15%;
}
@media only screen and (max-width: 768px) {
.custom_content a { display: none !important; }
span.header-text { font-size: 16px; }}

    Cheers!
    Yigit

    March 6, 2015 at 2:36 pm #406985
    josephhunterdesign

    How do I get the right header image to be spaced the same distance from the edge of the header as the logo?

    March 6, 2015 at 8:16 pm #407253
    Josue

    Hey!

    Change this in Quick CSS:

    .custom_content {
right: -15%;
}

    To:

    .custom_content {
right: -9%;
}

    Regards,
    Josue

    • This reply was modified 9 years, 9 months ago by Josue.
    May 29, 2015 at 10:18 pm #451828
    ewingmh

    I did this same thing to http://www.mountainhm.com – it works until I try to add an anchor tag to it:
    970-209-2763
    Which breaks the site… any way to make a tel anchor tag work?

    May 29, 2015 at 10:26 pm #451829
    ewingmh

    An easier way to do this would be to turn on the extra elements phone-info section and then use the .phone-info class to move it next to the logo – but then there is the extra empty phone-info header area above the logo – how do you remove that extra area but still use the phone-info element?

    June 1, 2015 at 9:59 am #452416
    Ismael

    Hi!

    What do you mean by anchor tag? Please post the code that you used. Header looks fine when I checked it.

    Best regards,
    Ismael

  • Author
    Posts
Viewing 17 posts - 1 through 17 (of 17 total)
  • You must be logged in to reply to this topic.