Social Icons/links in Header and Missing Page Title Tag

This topic has 52 replies, 5 voices, and was last updated 9 years, 10 months ago ago by Eva Kemp

  • Avatar: P90Pete
    P90Pete
    Participant
    June 24, 2014 at 20:18

    Hello,
    I tried adding a text widget using html I found on WordPress/support to the Place In Header sidebar to add social icons in the upper right corner of the header with no success. I’m pretty sure I need to add code to a .css but I’m not sure which file (header.css or custom.css or ?) to edit or what style I need to add. I’m not using site search or the expand/collapse sidebar icon and would like the icons to replace them. Please let me know how to proceed.

    The header under the breadcrumbs on the portfolio page is missing the <h2> title (On my site: <h2>Projects</h2>) under the breadcrumb and I would like it to be consistent with the other pages. How do I add the header to this page? Also, is there a way to turn the sorting buttons off on the portfolio page (I deleted all the buttons but the Show All button is still on the page)?

    Thanks in advance for your support!
    Pete

    51 Answers
    Avatar: Eva
    Eva Kemp
    Support staff
    June 25, 2014 at 09:31

    Hello,

    Please provide us with FTP and admin panel credentials in Private Content.
    Also please clarify what exactly you want to do with the breadcrumbs.
    Thank you.

    Regards,
    Eva Kemp.

    Avatar: P90Pete
    P90Pete
    Participant
    July 2, 2014 at 23:39

    The breadcrumbs issue was fixed when I updated the latest version of the template. I still have several other issues I can use your help with:

    1. Add social icons/links to the upper right corner of the header.
    2. The company logo in the header needs to be larger. I can’t figure out how to accomplish this.
    3. Since I upgrade the theme Visual Composer is no longer an option in portfolio and post pages.

    Please see the info in private content for access.

    Your help is really appreciated!
    Pete

    Please, contact administrator
    for this information.
    Avatar: Jack Richardson
    Jack Richardson
    Support staff
    July 3, 2014 at 06:58

    Hello,

    1) To add social icons you can use some 3rd-party plugin for this purpose.
    2) To increase logo size add the following code into the custom.css and change width value to the desired:

    .header-type-3 .container .menu-wrapper .logo-with-menu {
    width: 250px;
    }

    3) You should go to Visual Composer settings and specify in which pages it should be used.

    Here is a video tutorial how to create custom.css: https://www.youtube.com/watch?v=Qok2zRedRMY&feature=youtu.be.

    Regards,
    Jack Richardson

    Avatar: P90Pete
    P90Pete
    Participant
    July 3, 2014 at 14:48

    Thanks Jack. I really appreciate the quick reply!

    Last questions (no promises 😉
    On my projects page the teasers are showing up as a jquery string or as greeked text. I edited the custom teaser on each page yet they are still not displaying properly. Please let me know how to fix this issue.

    Also, on several page including my homepage I can’t seem to add the class = center on the buttons. What am I doing wrong?

    Thanks again for you support!
    Pete

    Avatar: Jack Richardson
    Jack Richardson
    Support staff
    July 3, 2014 at 15:23

    Hello,

    1) To get rid of this problem you should fill excerpt field for your project with the issue. Excerpt is mandatory field.
    2) You should edit column and add “a-class” to the extra class name field as it shown on the screenshot below:

    Regards,
    Jack Richardson

    Avatar: P90Pete
    P90Pete
    Participant
    July 3, 2014 at 17:05

    Seems like I still need custom CSS code to include it in the upper right corner above the main nav. Please let me know if this true and send the code.

    I’m using Social Menu Icons because I like that it picks up the font style. Is there another plugin that I should consider?

    Thanks!

    Avatar: Eva
    Eva Kemp
    Support staff
    July 3, 2014 at 17:21

    Hello,

    Could you please clarify your question? What is wrong with your menu?

    Regards,
    Eva Kemp.

    Avatar: P90Pete
    P90Pete
    Participant
    July 3, 2014 at 18:26

    Nothing is wrong with the menu. I would like to add social icons in the header, on the upper right corner of the page, above the main nav/menu in the gray bar where the search and cart elements would be.

    Jack suggested using a plugin and the one I downloaded adds them to the main nav. I don’t want them there and asked if I should consider a different plugin and if I will need to add code to get them to display as requested in the paragraph above on this post.
    Thanks,
    Pete

    Avatar: Eva
    Eva Kemp
    Support staff
    July 3, 2014 at 18:37

    As I see you have text widget with the social media links added into the “Place in header top bar” widget area. I’ve enabled Languages area in Theme Options and the links have appeared on top header area of the site. Is it what you wanted?

    Regards,
    Eva Kemp.

    Avatar: P90Pete
    P90Pete
    Participant
    July 3, 2014 at 19:11

    It’s close. I want it to align right but it is in the right part of the header. I’ll see if I can make it happen and will post if I need your support.

    Thanks for your quick response and help.

    Avatar: Eva
    Eva Kemp
    Support staff
    July 3, 2014 at 19:24

    You’re welcome.
    We’ll leave the topic opened if you need further assistance from us.

    Regards,
    Eva Kemp.

    Avatar: vphan
    vphan
    Participant
    July 7, 2014 at 11:58

    Hi P90Pete, Hi Eva,

    I have the same demand, what is the plain you use for your social media icon links and what code and where must I insert it please?

    Many thanks to both of you.

    With best regards.

    vphan

    Avatar: Eva
    Eva Kemp
    Support staff
    July 7, 2014 at 12:12

    Hello @vphan,

    If you want to add facebook icon, for example, then you need get code for it. To do this you can go to this link https://developers.facebook.com/docs/plugins/share-button and create the code, then you need add this code into Text widget and drag it into the “Place in header top bar” widget area in Appearance > Widgets. Don’t forget to enable Languages area in Theme Options > Header.
    Or you can use some plugin (for example http://wordpress.org/plugins/social-media-widget/).

    Regards,
    Eva Kemp.

    Avatar: vphan
    vphan
    Participant
    July 7, 2014 at 12:38

    Hello Eva,

    Thanky you very much for kind and efficient answer.

    How can I align this widget right or center?

    Many thanks to you.

    vphan

    Avatar: Eva
    Eva Kemp
    Support staff
    July 7, 2014 at 12:44

    Hello,

    Please provide us with the link to your site where the widget is displayed and we’ll guide you.

    Regards,
    Eva Kemp.

    Avatar: vphan
    vphan
    Participant
    July 7, 2014 at 12:49

    The website is on maintenance mode.

    here’s a capture:

    Avatar: Eva
    Eva Kemp
    Support staff
    July 7, 2014 at 13:18

    Hello,

    Try to use this code into custom.css file:

    .top-bar .languages-area {
        float: none;
        text-align: center;
    }

    Here you can watch the tutorial how to create custom.css.

    Regards,
    Eva Kemp.

    Avatar: P90Pete
    P90Pete
    Participant
    July 7, 2014 at 17:50

    I used the Simple Social Icons plugin and added the Widget to Place in header top bar in widgets. You can change the colors and hover colors. Very easy.

    I really appreciate the great support from the folks at EightTheme.

    Avatar: Eva
    Eva Kemp
    Support staff
    July 7, 2014 at 17:55

    Hello @P90Pete,

    Thank you for your feedback!
    We really appreciate it!

    If you have any questions don’t hesitate to contact us.
    Have a nice day!

    Regards,
    Eva Kemp.

    Avatar: vphan
    vphan
    Participant
    July 8, 2014 at 10:29

    Dear P90Pete,

    Thank you very much for your kind information!

    Thanks for the code @Eva Kemp,

    What should I do if I wish to invert place between WPML flags and social media Widget?

    Thank you for your precious help!

    Avatar: Robert Hall
    Robert Hall
    Support staff
    July 8, 2014 at 10:37

    Hello vphan,

    Please provide us with link to the page and wp-admin access in Private Content.

    Regards,
    Robert Hall.

    Avatar: vphan
    vphan
    Participant
    July 8, 2014 at 10:50

    Thanks Robert Hall,

    But the site on is on maintenance mode and we need the code to make some test.

    With kinds regards,

    vphan

    Avatar: vphan
    vphan
    Participant
    July 8, 2014 at 10:51

    Dear Eva,

    Would it be to have the code for mobile language switcher too please.

    Thank you a lot.

    Avatar: Eva
    Eva Kemp
    Support staff
    July 8, 2014 at 11:11

    Hello,

    Just to clarify: do you want to swap the social media icons with the language switcher or use the code you’ve been provided earlier for mobile devices?
    Please note: it will be difficult to provide the code for the language switcher without seeing the site. So it would be better if you give us some test link of your site.

    Thank you.
    Regards,
    Eva Kemp.

    Avatar: vphan
    vphan
    Participant
    July 8, 2014 at 11:33

    This what I wish to have for option, it is not sure I will keep this option at the end:

    Please, contact administrator
    for this information.
    Avatar: Eva
    Eva Kemp
    Support staff
    July 8, 2014 at 11:39

    Hello,

    Thank you for the credentials but I can’t see your site (it’s under maintenance mode). Please provide us with the appropriate permissions.

    Regards,
    Eva Kemp.

    Avatar: vphan
    vphan
    Participant
    July 8, 2014 at 11:53

    ho, sorry,

    I change the permissions.

    Best regards

    Avatar: Eva
    Eva Kemp
    Support staff
    July 8, 2014 at 12:06

    Thank you for the permissions.
    To swap those widgets you need insert the following code into custom.css file:

    .simple-social-icons {
        float: right;
    }
    .top-bar .languages-area {
        text-align: left;
    }

    To enable top bar area on mobile add this code into custom.css:

    @media (max-width: 480px){.top-bar .languages-area {
        display: block;
    }}

    Regards,
    Eva Kemp.

    Avatar: vphan
    vphan
    Participant
    July 8, 2014 at 12:32

    Thank you very much Eva,

    Thank you for your kindness and patience.

    Best regards.

  • 1 2
    Viewing 30 results - 1 through 30 (of 52 total)

The issue related to '‘Social Icons/links in Header and Missing Page Title Tag’' has been successfully resolved, and the topic is now closed for further responses

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.