Tagged: ,

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • November 12, 2013 at 2:43 am #187070
    jazbird

    hi,

    i would love to add social icons to the right of my main nav as per your site.

    i’m currently using a small non-fixed header.
    i don’t like the layout of the other options – especially when it creates a 2nd nav.

    website – http://www.bikinibootcamp.com/dev/

    thanks…

    jaz

    November 12, 2013 at 3:05 am #187074
    Devin

    Hi jazbird!

    Unfortunately Kriesi’s child theme layout/customizations aren’t available without customizing them yourself right now. He will be releasing some tutorials down the road for how he did some of theme and others he’ll include with the theme in a future update.

    We aren’t however able to assist in making the same customizations.

    Regards,
    Devin

    November 12, 2013 at 3:35 am #187084
    jazbird

    ok… thanks.

    but can u add an icon to the main nav? or is it only text?

    jaz

    November 12, 2013 at 2:43 pm #187252
    Ismael

    Hi!

    You can edit header.php, find this code on line 183:

    /*
                            * Hook that can be used for plugins and theme extensions
                            */
                            do_action('ava_after_main_menu');

    Above it, add this code:

    echo avia_social_media_icons($social_args);

    Go to Enfold > Styling > Quick CSS then add this code:

    #header_main .social_bookmarks {
position: absolute;
top: 20%;
}

    Cheers!
    Ismael

    November 14, 2013 at 7:38 pm #188521
    jordandsa

    Hi there,

    First, I LOVE the Enfold Theme for my photography site! Thank you for creating it! It’s absolutely amazing.

    I’ve got 2 questions regarding social media icons in the top nav:

    1. How do I replace the icons with my own custom icons?
    2. When viewing the site on a mobile device like an iPhone or Android, the social media icons overlap the nav links. How do I fix the formatting so it doesn’t look jumbled on the handheld device? I have limited coding ability, but I can figure stuff out.

    http://www.KillerPhotography.com

    Thanks,
    Jordan

    • This reply was modified 11 years ago by jordandsa.
    November 15, 2013 at 5:40 pm #189313
    Devin

    Hey!

    For #1, you can watch this video: https://vimeo.com/channels/aviathemes/75743285

    The fonts have to be in the same font format as the ones from fontello however.

    For the social icons, you’ll need to add additional alignment with css to the media query in your custom.css file. There are two provided as an example, one for desktop only and the other for mobile only.

    Regards,
    Devin

    November 15, 2013 at 8:23 pm #189403
    jordandsa

    Hey Devin,

    Thanks so much for your response. I am aware of the icon font manager, however, I apologize for not being clear. I would like to use an actual custom image/logo, not a fontello font or other type of icon font. Is there a way to replace the icon font in the nag with just an actual .jpg or .png file? And will I be able to have them display properly on mobile devices?

    To that question of mobile display, I saw in the custom css file the examples you refer to, but I’m not sure what I need to do. Do I need to write css for mobile viewing myself? If so, can you direct me to where I can find code snippets, as I am entirely not proficient in writing my own code. I’m great at copying and pasting, however ;)

    Thanks so much,
    Jordan

    November 16, 2013 at 1:14 am #189481
    jazbird

    hi ismael…

    sorry for late reply… i tried this and it’s not working?

    this is the header.php code i edited… and i added the css code but nothing?
    any ideas…?
    http://bikinibootcamp.com/dev/

    echo avia_social_media_icons($social_args);
    do_action(‘avia_meta_header’);
    echo ‘</nav>’;
    ?>
    </div>
    </div>

    November 16, 2013 at 1:16 am #189482
    jazbird

    do i need ti select a certain header type for it to work? i’m using small fixed header now…

    November 17, 2013 at 6:05 pm #189824
    Devin

    No, Ismael’s code doesn’t require any specific heading. It forces the output into the header with any heading type if done correctly. Just make sure you are adding in the code exactly and where specified.

    To get the exact same header will require a freelance developer. We have been asked by Kriesi *not* to provide the customizations he has done to his child theme as he would like to keep his customization separate for now.

    November 27, 2013 at 1:59 am #193652
    jazbird

    thank you!
    i obviously put it in the wrong spot first time…

    November 27, 2013 at 5:54 am #193694
    Ismael

    Hi!

    Glad we could help. :)

    Best regards,
    Ismael

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘adding social icons like the Kriesi site with a small non-fixed header’ is closed to new replies.