$conf, $runtime; function_exists('chdir') AND chdir(APP_PATH); $r = 'mysql' == $conf['cache']['type'] ? website_set('runtime', $runtime) : cache_set('runtime', $runtime); } function runtime_truncate() { global $conf; 'mysql' == $conf['cache']['type'] ? website_set('runtime', '') : cache_delete('runtime'); } register_shutdown_function('runtime_save'); ?>php - Bring Font Awesome icons inside menu A tags|Programmer puzzle solving
最新消息:Welcome to the puzzle paradise for programmers! Here, a well-designed puzzle awaits you. From code logic puzzles to algorithmic challenges, each level is closely centered on the programmer's expertise and skills. Whether you're a novice programmer or an experienced tech guru, you'll find your own challenges on this site. In the process of solving puzzles, you can not only exercise your thinking skills, but also deepen your understanding and application of programming knowledge. Come to start this puzzle journey full of wisdom and challenges, with many programmers to compete with each other and show your programming wisdom! Translated with DeepL.com (free version)

php - Bring Font Awesome icons inside menu A tags

matteradmin9PV0评论

I'm using the underscores _s bare bones theme and have made a second menu for which I've added font-awesome classes to the optional CSS-classes for the menu's navigation labels to produce icons appearing alongisde the label text, which is as desired.

What i noticed however is that the icons themselves, whilst appearing as part of the menu's li tag, appear before the a tag begins, and the label itself appears inside the a tag. This is problematic as what I'm aiming for is a font-awesome only menu which I can easily adjust from the back end, for this I need the icons to be clickable, and I need the navigation label text to not be present in the front end.

so my question is how do I move the icons to be inside the the a tags rather then outside and how do I ensure the navigation label text is not present in the front end? I am not a coder however, I've just dabbled in it here and there, any help would be highly appreciated.

edit - font awesme icons appear as part of li css classes, but still outside of a class

possible solution could be retrieve the font-awesome class from the li classes and ADD it to the menu's a classes? the font awesome classes appear as the first class listed for the li classes.

below is the front-end source code for the menu -

<div class="custom-menu-class">
<ul id="menu-socials" class="menu">
<li id="menu-item-86" class="fab fa-youtube menu-item menu-item-type-custom-menu-item-object-custom menu-item-86">
::beofre
<a target="_blank" href="">YouTube</a>

I'm using the underscores _s bare bones theme and have made a second menu for which I've added font-awesome classes to the optional CSS-classes for the menu's navigation labels to produce icons appearing alongisde the label text, which is as desired.

What i noticed however is that the icons themselves, whilst appearing as part of the menu's li tag, appear before the a tag begins, and the label itself appears inside the a tag. This is problematic as what I'm aiming for is a font-awesome only menu which I can easily adjust from the back end, for this I need the icons to be clickable, and I need the navigation label text to not be present in the front end.

so my question is how do I move the icons to be inside the the a tags rather then outside and how do I ensure the navigation label text is not present in the front end? I am not a coder however, I've just dabbled in it here and there, any help would be highly appreciated.

edit - font awesme icons appear as part of li css classes, but still outside of a class

possible solution could be retrieve the font-awesome class from the li classes and ADD it to the menu's a classes? the font awesome classes appear as the first class listed for the li classes.

below is the front-end source code for the menu -

<div class="custom-menu-class">
<ul id="menu-socials" class="menu">
<li id="menu-item-86" class="fab fa-youtube menu-item menu-item-type-custom-menu-item-object-custom menu-item-86">
::beofre
<a target="_blank" href="http://www.youtube/user/channel">YouTube</a>

Share Improve this question edited Jan 2, 2019 at 12:54 bldingbloks asked Jan 2, 2019 at 12:33 bldingbloksbldingbloks 33 bronze badges 0
Add a comment  | 

1 Answer 1

Reset to default 0

What I have tried in the past is to place the Font-awesome code with class name in the label field and remove any current labels. Instead of using the optional class field, this worked for me in the past. I have not tried it lately, so I am not sure if this still works.

For example the following code would be placed in the label.

<i class="far fa-address-card"></i>
Post a comment

comment list (0)

  1. No comments so far