header.html

[dmx1]

Hi Larry,

I tried researching but I still don't fully understand the following lines of code on page 68 in the 2nd edition of Effortless Ecommerce:

 

/// Create each menu item: foreach

1. foreach ($pages as $k => $v) {

       // Start the item:

 2.           echo  ' <li ' ;

       //Add the class if it's the current page:

 3.       if ($this_page == $v)

 4.                  echo ' class="active" ' ;

        // Complete the item:

 5.       echo ' ><a href= " ' . $v . ' "> ' $k . ' </a></li> ' ;

// End of FOREACH loop.

 

I understand that the foreach loop iterates through each page's key and value'

 

I get confused at line 2:

echo  ' <li ' ;

This displays the list item.

Qu 1: The list item isn't completed, it's just an 'li' tag, so how do you print just a 'li' tag?

 

Line 3 and 4 confuses me.

if ($this_page == $v)

    echo ' class="active" ' ;

You say if the current page is equal to it's value, then print the class with a value of 'active'

Qu: 2 How do you print a class with a value of active? Can you explain how the echo statement prints a class with a value of active

I looked inside the css stylesheet and there's no 'active' selector, so how does class='active' relate to the page's values?

 

Line 5  prints the hyperlink. It prints the value and the associated key

echo ' ><a href= " ' . $v . ' "> ' $k . ' </a></li> ' ;

 

I don't understand how you constructed it in this way.

 

Qu 3:  What's the significance of the following snippet below, and why add in '>'

        . $v . ' "> ' $k . '

 

Thanks

regards

 

 

 

 

[JayAtHome]

dmx1,

You are building the complete list item as you iterate through the loop.
Do this... open a notepad. Manually look/loop through the code. 
1.  When you get to echo, take that part and put it in the notepad.
2.  After it is in the note pad replace any variable names with their corresponding values. 
           $k is symbolic for the "Key" part of the Key-Value pair.
           $v is the symbolic for the "Value" part of the Key-Value pair.
           In case you missed it the Key / Values are on page 67. step 4.
3. if you did this correctly, you will end up with the same thing as figure 3.9 on page 68.
Your web server will do exactly as you did (if you did it correctly) and build a "li" or List Item for each time through the loop.
The "active" class part is to apply special CSS "Class" to the element so it will display differently.
4. If this helps you please drop a line at jay.a.carlson@gmail.com
/r
Jay
Please checkout my slightly modifed website at https://J5CMarketing.com

[dmx1]

Ok.

 

Thank you Jay. I will try and implement your instructions.

 

Really appreciate you taking time out to reply.

 

regards

 

Edited September 19, 2020 by dmx1

[Larry]

That's a really good technique, Jay! Thanks for sharing that!

[JayAtHome]

Thanks Larry!