Moving icon inside the menu – php question pls

  • Resolved Lesley2013

    (@lesley2013)


    12 years, 10 months ago

    Hi

    I’ve hard-coded the style fb icon into my header.php

    however my php is limited…. and would like it to appear inside the menu to the right.

    Any suggestions on how to do this please?

    here is the development site

    here is the code i have.

    <nav id="site-navigation" class="main-navigation" role="navigation">

             <!--start Facebook Icon-->
<div style="float:right;width:97px;position:relative;height:20px;margin-top:10px;"><?php if( function_exists( 'fcbk_bttn_plgn_shortcode' ) ) echo
fcbk_bttn_plgn_shortcode("") ; ?></div>
<!--end Facebook Icon-->

<h3 class="menu-toggle"><?php _e( 'Menu', 'twentytwelve' ); ?></h3>

			<a class="assistive-text" href="#content" title="<?php esc_attr_e( 'Skip to content', 'twentytwelve' ); ?>"><?php _e( 'Skip to content', 'twentytwelve' ); ?></a>
			<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
		</nav>

        <!-- #site-navigation -->
Viewing 15 replies - 1 through 15 (of 23 total)
1 2
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    12 years, 10 months ago

    You may want to undo that and first set up a Child Theme and copy the file you want to modify and paste it into your Child Theme directory. Then you can hardcode that file within your Child Theme. Otherwise your changes will be lost when the theme updates.

    Thread Starter Lesley2013

    (@lesley2013)

    12 years, 10 months ago

    um it is in a child folder

    Thread Starter Lesley2013

    (@lesley2013)

    12 years, 10 months ago

    i’m using Twenty Twelve Dark

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    12 years, 10 months ago

    Your Facebook stuff isn’t part of your navigation menu, so it shouldn’t be in the “nav” HTML element. Move it under the “nav” element and just use the top property to move it upwards with CSS.

    You may also need to look at moving it for smaller widths.

    Thread Starter Lesley2013

    (@lesley2013)

    12 years, 10 months ago

    perfect thank-you so much 🙂

    Thread Starter Lesley2013

    (@lesley2013)

    12 years, 10 months ago

    i think i kind of got it… lol

    except its still not floating right unless i give it a margin of 850px;

    here is the css:

    #align-right {
	float:right;
	position:absolute;
  	margin:-32px 0 0 855px;
	overflow:auto;
	clear: right;
	position:absolute;
}
    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    12 years, 10 months ago

    You don’t need absolute positioning, use relative.

    Thread Starter Lesley2013

    (@lesley2013)

    12 years, 10 months ago

    thanks… i don’t think its going to work in there… i just checked on safari and it seems that the links spread out on the menu therefore the fb icon is overlapping it…. 🙁 such a shame cause i thought that was the best place for it.

    Thread Starter Lesley2013

    (@lesley2013)

    12 years, 10 months ago

    ok i’m nearly there…. except it still won’t align right 🙁

    Any way of forcing the php code to get the image to align right somehow?

    <div id="my_details">Enquiries: xxxx xxx xxx<br><span>yada</span><br>

<!--start Facebook Icon-->

<?php if( function_exists( 'fcbk_bttn_plgn_shortcode' ) ) echo
fcbk_bttn_plgn_shortcode("") ;  ?>
</div>
<!--end Facebook Icon-->

<!--end Contact Details-->
    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    12 years, 10 months ago

    Try adding:

    #fcbk_share .fcbk_button {
 margin-right: 0
}

    Thread Starter Lesley2013

    (@lesley2013)

    12 years, 10 months ago

    how do i add the id to the actual php code? sorry i haven’t done php before. and i’m very very rusty at css. i make cakes 🙂 LOL

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    12 years, 10 months ago

    The ID is already there, just add the CSS to your Child Theme style.css file.

    Thread Starter Lesley2013

    (@lesley2013)

    12 years, 10 months ago

    mmm doesn’t work 🙁

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    12 years, 10 months ago

    It worked but now your HTML structure is different, your facebook icon is no longer in an iFrame. Make sure you don’t change your HTML structure if you want accurate advice.

    Thread Starter Lesley2013

    (@lesley2013)

    12 years, 10 months ago

    all i did was add a table? mmm let me have a look again…. sorry about that…

Viewing 15 replies - 1 through 15 (of 23 total)
1 2

The topic ‘Moving icon inside the menu – php question pls’ is closed to new replies.