Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • January 20, 2018 at 7:27 pm #900163
    audiopablo

    Hi there,

    first of all, enfold is a great theme,
    i’ve bought just another license for a new project:

    Home

    Heres the problem to solve:
    #header_meta .iconbox_icon
    the icons are both before phone and mailaddress and not how it should be, belonging to phone number and mail address, although the code in header extra elements is this alike:

    <div class=”iconbox_icon heading-color” aria-hidden=”true” data-av_icon=”” data-av_iconfont=”entypo-fontello”></div> + 49 177 401 9232 oder (Email address hidden if logged out) “><div class=”iconbox_icon heading-color” aria-hidden=”true” data-av_icon=”” data-av_iconfont=”entypo-fontello”></div> (Email address hidden if logged out)

    i’ve read the helpful coding from yirgi, posted sometime ago:

    Please add following line to in front of your mail address
    <div class=”iconbox_icon heading-color” aria-hidden=”true” data-av_icon=”” data-av_iconfont=”entypo-fontello”></div>

    And add following code to Quick CSS to adjust the size of the icon
    #header_meta .iconbox_icon { font-size: 14px;

    but Ive got the same problem as “anonymous”.

    Isn’t there a easy way to link the icons of the font-family: ‘entypo-fontello as a css :before element?

    i’ve tried this too. but the result showed only the charset nr. before the phone:

    .phone-info:before {
    content: “1F4DE”;
    font-family: ‘entypo-fontello’;
    }

    So, i would be very grateful for a hint or help anyway, because i’ve got to integrate those icons in the footer colums (widgets) too!

    Thanks so much,
    regards form munich,
    paul

    January 20, 2018 at 9:06 pm #900185
    Mike

    Hey Paul,
    Please try this solution: icons inline with your text, in your header extra bar.

    Best regards,
    Mike

    January 20, 2018 at 10:24 pm #900208
    audiopablo

    Hi Mike,

    thanks so much for your fast respond and solution:)

    it works fine, at last:
    is there a way so set some margin-top to the icons, so that they get down a little bit?
    it didn’t react, with “line-height” is shifting, but in the wrong direction…

    Thanks again and best regards,
    Paul

    January 20, 2018 at 10:27 pm #900210
    Mike

    Hi,
    Please include the url to the page in question so we can take a closer look.
    How much space would you like, 10px?

    Best regards,
    Mike

    January 20, 2018 at 10:41 pm #900215
    audiopablo

    Hi Mike,

    i’m testing on a local server, heres a screen:
    https://www.dropbox.com/s/m6rz1a7539r1lhu/Screenshot%202018-01-20%2021.36.53.png?dl=0

    i think 4px should do,

    the live site of the client is still with the “old” solution:

    Home

    Best regards,
    paul

    January 20, 2018 at 11:01 pm #900219
    Mike

    Hi,
    Padding & margin isn’t working on this, but vertical-align: middle is pretty close.
    Please try adding:

    .phone-info span {vertical-align: middle!important; }

    Best regards,
    Mike

    January 21, 2018 at 10:21 am #900323
    audiopablo

    Hi Mike,

    thanks a lot, this did it:)

    Before closing the topic: how can i ad the icons easily before the head tag of the footer column (widget)?

    The same way?

    And: is there a instruction available to get better known with your enfold short-cut-tags?

    Last question: i find it hard, to create a new topic at the forum, because the button appears only after clicking a while around, is that normal?

    Thanks a lot for your fast and useful help,
    regards from munich,
    paul

    January 21, 2018 at 3:34 pm #900364
    Mike

    Hi,
    1)Do you mean here where the arrow is?
    2018-01-21_074609
    unfortunately the title field doesn’t allow code so we would need to use css to add the icon there. As you see the body of the widget does allow code if you use the Custom HTML widget. Here is a good read on the subject: How to Customize WordPress Widget Titles

    2)Please see our Video Tutorials for learning more about Enfold

    3) Do you mean this button?
    2018-01-21_082958
    You should have no issues with it, what browser and OS are you using?

    Best regards,
    Mike

    January 21, 2018 at 4:20 pm #900377
    audiopablo

    Hi Mike,
    thanks for the infos,
    1) ok, got it, but i saw in your example the phone icon before the copy: is there a easy way to do this?

    2) ok.

    3) No,not the Submit Button, this is always there. I meant the large, blue button to create a NEW topic, it appears only after searching around in the support-forum with the message “Didn’t find what you’re looking for? Create a new topic” .
    It should be possible, to create a new topic immediately, shouldn’t it?
    I’m using Chrome under OSX 10.9.5.

    Best regards and thanks for your patience.
    paul

    January 21, 2018 at 5:46 pm #900402
    Mike

    Hi,
    1) I used this shortcode:

    [av_font_icon icon='ue854' font='entypo-fontello' size='20px'][/av_font_icon]

    in the widget while in the “text” tab.
    2018-01-21_103616

    3) The big blue button is a anchor button that is pointing to the bottom of the page from the main forum page, and doesn’t show in the search results or when viewing another topic. Please try adding this to your bookmark bar for quick access: Enfold New Topic

    Best regards,
    Mike

    January 21, 2018 at 9:16 pm #900457
    audiopablo

    Hi Mike,

    perfect:)
    Thanks a lot for the very good help and
    lets close this topic now.

    Best regards from Munich,
    Paul

    January 21, 2018 at 9:24 pm #900461
    Mike

    Hi,
    Glad we were able to help, we will close this now. Thank you for using Enfold.

    Best regards,
    Mike

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘adding icons to header extra elements and footer colum widgets’ is closed to new replies.