Archived topic

Social icons inline with other 3 items in top menu bar

6 replies · Started by Mark on June 21, 2018

Viewing posts 1–7 of 7

June 21, 2018 at 10:12 am #605461

I am using Tom's Lightweight Social icons and trying to place them in the top menu bar to the left of the existing 3 items. However, when I add this widget to the top menu bar area, they end of above the existing items, instead of inline with them. You can see this in my site. Please advise.

Thanks,

Mark

June 21, 2018 at 12:34 pm #605554

Hi there,

I'm not seeing any LSIs on that page you linked.

Can you add it in so I can see the problem?

June 21, 2018 at 12:55 pm #605567

Sorry Leo - its in there now.

Mark

June 21, 2018 at 1:47 pm #605594

Leo, I forgot to ask you - can each of the social icons be a different color?

Thanks,

Mark

June 21, 2018 at 3:12 pm #605643

I can see the code for LSIs but not actually seeing the icons.

Is it working for you?

As for the layout, try this option:
https://docs.generatepress.com/article/top-bar-widget-area/#secondary-navigation

June 21, 2018 at 3:21 pm #605647

Hi Leo,
Yes, they are on there now. I forgot to save.

Does that link you sent me also deal with different colors for the individual icons?

Mark

June 21, 2018 at 6:54 pm #605702

Here are the CSS to change the colors for each of them:

.icon-set-lsi_widget-2 .lsi-social-facebook a {
    background-color: #fff !important;
    color: #000 !important;
}
.icon-set-lsi_widget-2 .lsi-social-twitter a {
    background-color: #fff !important;
    color: #000 !important;
}
.icon-set-lsi_widget-2 .lsi-social-instagram a {
    background-color: #fff !important;
    color: #000 !important;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

This archived topic is closed to new replies.

Start building better websites today.