- This topic has 18 replies, 5 voices, and was last updated 6 years, 7 months ago by Tomas.
-
AuthorPosts
-
October 25, 2014 at 7:27 pm #41750Elwin Hoover
Tom,
I want my four social icons to float right like yours on your website. I don’t know how to do this and I am no coder by any means. I’ve gone to font awesome and put in the code to my menu, but I’m not sure what to add to the CSS styling for that menu option to make it float right on the navigation bar. Any help you can offer would be greatly appreciated!
Thank you!
October 25, 2014 at 7:33 pm #41752Elwin Hooverhooverlandclearing.com
October 25, 2014 at 11:43 pm #41784TomLead DeveloperLead DeveloperHi Elwin,
There’s a couple of steps here:
1. In “Appearance > Menus”, expand the “Screen Options” panel at the top right of the page.
2. Select the checkbox for “CSS Classes”.
3. Now open you menu item, and give it a class we’ll use later – like “your-class-name”.Now, you can add this CSS:
.your-class-name { float: right; }
That should do it ๐
November 1, 2014 at 2:50 pm #43416Elwin HooverHi Tom,
Thanks for the quick reply. I’m confused on the classes and what to put in it. I no nothing about code.
I copied <i class=”fa fa-facebook”></i> and put it in the menu. But I don’t know what exact class to put into the CSS Classes box?
Thank you.
November 1, 2014 at 3:23 pm #43428Elwin HooverI downloaded the simple custom css plugin.
November 1, 2014 at 3:33 pm #43430Elwin HooverI named my CSS class facebook.com and put this in the CSS under the “editor” tab:
.facebook-icon {
float: right;
}But nothing is happening?
November 1, 2014 at 3:33 pm #43431Elwin HooverI mean I named it facebook-icon
November 1, 2014 at 4:35 pm #43432Elwin HooverTom, I’ve decided that I want the social icons at the bottom of the page, centered right above my copyright. How can I do that without using all the footers?
November 1, 2014 at 4:46 pm #43433Elwin HooverJust figured it out, Tom. Thanks!
November 1, 2014 at 5:00 pm #43435Ross RobsonIv tried that too tom and it doesn’t work, iv named mine facebook-menu and used the css
.facebook-menu {
float: right;
}but nothing happens and it remains in the same place
November 1, 2014 at 5:12 pm #43436Ross RobsonMe too lol
November 1, 2014 at 5:43 pm #43437Ross RobsonAny idea how i can get the nav search icon to be last so its to the right side of all the current icons?
November 1, 2014 at 6:40 pm #43443TomLead DeveloperLead DeveloperYou both figured it out? ๐
At this time no, the code inserts the button as the last item in the menu bar, so it ends up being first item to display as the buttons are using float. You could position each button precisely using position:absolute, but you would need to look that up and then figure out the width of each item. Kind of a pain.
September 11, 2017 at 11:51 am #383372TomasHey Tom,
New to generatepress here.
I have a question related to the subject.
I need my social icons to be on the main navigation bar but not right after the pages, I want it to be against the right edge of the screen, with a little padding of course.
And I want the links to open in a new window.
Is this possible?Thanks,
TomasSeptember 11, 2017 at 11:56 am #383376TomasAlready solved the opening in new window problem.
Here is my site:
http://www.simpletravelblog.com -
AuthorPosts
- You must be logged in to reply to this topic.