Social icons and menu position

Just noticed you didn’t add Instagram, nor Pinterest option to social links. Would appreciate so much if you add these options too!

Best regards
AlicePH

AlicePH

You can remove this function from footer.php and add to header.php in place where you want to see social icons.
<?php fruitful_get_footer_socials_icon(); ?>

You can add position for menu in theme options > custom css. Do you have some skills? Can you show your website?

We will add Instagram, Pinterest icons in next plugin version.

Hi, thank for answer:)

Some little skills may be:)
I found selector for menu now! But I will keep it as in original. I have drop down/under menu and it doesn’t look so good if menu is farther down.

But other thing… social icons. I tried to du as you said, but i did’n work. Where exactly in header.php do I have to put <?php fruitful_get_footer_socials_icon(); ?> ?

or du it have to be whole thing? <div class=”social-icon”>
<?php fruitful_get_footer_socials_icon(); ?>
</div>

Tried both but didn’t work.

My testwebsite https://www.designtre.aliceph.se/

Thank you!

Insert

<div class="social-icon">
<?php fruitful_get_footer_socials_icon(); ?>
</div>

before <nav>

Also you will need to add additional styles to custom css

#masthead .social-icon {
    float:right
}
#masthead .social-icon a {
    float:left;
    width:30px;
    height:30px;
    opacity:1;
    background-image:url(images/social.png);
    background-repeat:no-repeat;
}
#masthead .social-icon a:hover, #masthead .social-icon a:active {
    opacity:0.9}
 #masthead .social-icon a.facebook {
    background-position:-249px 0;
}
#masthead .social-icon a.twitter {
    background-position:-280px 0;
}
#masthead .social-icon a.linkedin {
    background-position:-93px 0;
}
#masthead .social-icon a.myspace {
    background-position:-31px 0;
}
#masthead .social-icon a.googleplus {
    background-position:-62px 0;
}
#masthead .social-icon a.dribbble {
    background-position:0 0;
}
#masthead .social-icon a.skype {
    background-position:-125px 0;
}
#masthead .social-icon a.flickr {
    background-position:-187px 0;
}
#masthead .social-icon a.youtube {
    background-position:-218px 0;
}
#masthead .social-icon a.rss {
    background-position:-155px 0;
}
#masthead .social-icon a.vk {
    background-position:-311px 0;
}
#masthead .social-icon a.email {
    background-position:-342px 0;
}

I don’t know what is wrong but it din work:(

I did us u said. Header.php looks like this:

<hgroup>
								<?php echo fruitful_get_logo(); ?>
							</hgroup>
<div class="social-icon">
<?php fruitful_get_footer_socials_icon(); ?>
</div>
							<nav role="navigation" class="site-navigation main-navigation">
								<?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?>	

							</nav><!-- .site-navigation .main-navigation -->
						</header><!-- #masthead .site-header -->
					</div>
				</div>
			</div>
			<div class="container">
				<?php do_action( 'before' ); ?>
				<div class="sixteen columns">

`
[Moderator Note: Please post code & markup between backticks (not single quotes) or use the code button. Your posted code may now have been permanently damaged by the forum’s parser.]

I added custom css as well…

I understand the problem, custom css section don’t see path to image in previous example.

Use this instead

#masthead .social-icon a {
    float:left;
    width:30px;
    height:30px;
    opacity:1;
    background-image:url(./wp-content/themes/fruitful/images/social.png);
    background-repeat:no-repeat;
}

hey there, Fruitful Code (or AlicePH)!
in spite of all, could you tell me how to modify menu position?
And no, I don’t have css skills at all ??

danielkot,

1. Currently you see menu in header, right corner?
2. How you want to change position of the menu?
3. Can you provide link to your website?

Hey there,

this is my site: https://strefapotencjalu.home.pl/wordpress-3.8/wordpress/

I’d like to move menu to the top of site, something like that: https://strefapotencjalu.home.pl/wordpress-3.8/sample.jpg

thank you ??

You can reduce logo size and you will have place for menu items.

Hello,

I wanted to center align the top menu bar. Could you help with that. Also could not figure out how to switch the icon of the info column boxes. Thanks

https://www.jayrol.com

jayroi,

add this

.main-navigation {
width: 960px;
}

.main-navigation ul {
width: 500px;
margin: 0 auto;
}

to custom css in theme options

fantastic. thank you for the awesome theme!

Alright another questions. Is there anyway to stop the link on the first menu bar. “Example dead link on “portfolio”.also how to make the boxes not go out so far for sub menus. Please look at

https://www.jayrol.com.

thanks

jayroi,

1) You need to add, link to menu with url “#” https://codex.www.ads-software.com/WordPress_Menu_User_Guide#Adding_Items_to_a_Menu

2) Drop down menu, on your website at the moment have 500px width, because it’s html tag <ul> too.

Add this part of code to custom css

ul.sub-menu {
width: 280px;
}