Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
GS 3.4 Having Span inside native menu "a" elmt
#1
Hi, very good work Shawn, testing the V 3.4, i notice there is no SPAN inside native menu :

<nav id="main-nav">
 <ul>
   <li class="index current active">
     <a href="http://localhost/gs34/" title="Welcome to GetSimple!">Home</a>
   </li>

This is very useful when you have to full center x and y absis the word of the link.
https://philipwalton.github.io/solved-by...centering/

Can you add the SPAN Shawn ?
Reply
#2
Span where and why, not sure what you need a span for.
NEW: SA Admin Toolbar Plugin | View All My Plugins
- Shawn A aka Tablatronix
Reply
#3
hi, the SPAN needs to be there :

<li>
<a>
<SPAN> text shown </SPAN>
</a>
</li>

Why : do you see the red block in the picture, https://screenshotscdn.firefoxuserconten...ca8cc7.png
this is the A. (click zone) The LI is green border.

problem is, the A is not full width and full height, so hit zone is smaller than the user can expect.

With a SPAN, we can get A full and then center horizontally and vertically the SPAN (the text only, not the hitbox).

You can add this is 3.4 Shawn?
Reply
#4
Can you not just do that in css?
NEW: SA Admin Toolbar Plugin | View All My Plugins
- Shawn A aka Tablatronix
Reply
#5
If you can't do it with CSS as Shawn suggests, another way could be this:

Create a functions.php file in your theme folder and paste this in the file:
Code:
<?php defined('IN_GS') or die();

add_filter('menuitems','add_span_to_nav_links');
function add_span_to_nav_links($nav='') {
  return str_replace('##TMP##','"><a',str_replace(array('">','</a>'),array('"><span>','</span></a>'),str_replace('"><a','##TMP##',$nav)));
}
// end

(If you theme already had a functions.php file, paste in it everything but the first line.)
Reply
#6
(2018-12-02, 21:23:04)Carlos Wrote: If you can't do it with CSS as Shawn suggests, another way could be this:

Create a functions.php file in your theme folder and paste this in the file:
Code:
<?php defined('IN_GS') or die();

add_filter('menuitems','add_span_to_nav_links');
function add_span_to_nav_links($nav='') {
 return str_replace('##TMP##','"><a',str_replace(array('">','</a>'),array('"><span>','</span></a>'),str_replace('"><a','##TMP##',$nav)));
}
// end

(If you theme already had a functions.php file, paste in it everything but the first line.)

THX, i will try this tomorrow. have a nice day you both guys.
Reply
#7
I just dont really see the reasoning here, you can change the display mode of an li and a in css if you need a to not be inline use block
NEW: SA Admin Toolbar Plugin | View All My Plugins
- Shawn A aka Tablatronix
Reply
#8
Hi, thanks Carlos, this save my day, Shawn i can explain to you the reasoning there :
the span allows me to perfectly center the word, nonetheless, i give user bigger hitbox.
see the following screenshot
https://screenshotscdn.firefoxuserconten...43f751.png
cyan = link (hitbox)
green = span (the word)

this is why i asked for this SPAN element to be native in the 3.4.
this is the only way i know to have this result easily...
Reply
#9
Ok I think I get it now, yeah i would just use a custom menu generator.
NEW: SA Admin Toolbar Plugin | View All My Plugins
- Shawn A aka Tablatronix
Reply




Users browsing this thread: 1 Guest(s)