Template question 1

[apple]

I like the style on the Revero header (image attached) but I dont seem to able to adapt to other template. Below is my codes. Is there something else missing I should add?

On the index.php file under footer:

<a href="#" class="back-to-top"><i class="icofont-simple-up"></i></a>

In the CSS file:

.back-to-top {
  position: fixed;
  display: none;
  background: #febd01; /*#50d8af;*/
  color: #fff;
  padding: 6px 12px 9px 12px;
  font-size: 16px;
  border-radius: 2px;
  right: 15px;
  bottom: 15px;
  transition: background 0.5s;
}

.back-to-top:focus {
  background: #febd01; /*#50d8af;*/
  color: #fff;
  outline: none;
}

.back-to-top:hover {
  background: #febd01; /*0c2e8a;*/
  color: #fff;
}

[dbs]

Your attachement schows no back to top. only social icons.
What do you want?

[sternchen8875]

the code show's a link to the top of the page and use a icofont-icon, here a simple arrow like this .
This Icon-Font use a minified css-file and a font-file or, in a different variant, only a minified (s)css-File. Do you use it also in your template? Take a look to this "How to use" and search in your template for a link to the needed files like this

Code: [Select]

<link rel="stylesheet" href="your_project/templates/xxxxx/icofont/css/icofont.min.css">

[apple]

Your attachement schows no back to top. only social icons.
What do you want?

Sorry, gave the wrong link.
The back to top icon/link on the footer of my index.php file

<a href="#" class="back-to-top"><i class="fa fa-chevron-up"></i></a>

[crnogorac081]

From the template where you found this code, search for .js file. Search and copy the the code where "back-to-top" is called

[apple]

Why is the fontawesome for the new twitter x icon does not show? From what I understand the code is
<i class="fa-brands fa-x-twitter"></i>
Nothing came up at all when I used the code above. Anyone has the answer?

[apple]

I found the answer for fa fa x-Twitter. The font in the codes need updating. Can someone tell me how do I add menu links at the footer and with own layout id?
Thanks

[sternchen8875]

https://help.WebsiteBaker.org/en/designer-guide/multiple-menus.php

[apple]

https://help.WebsiteBaker.org/en/designer-guide/multiple-menus.php

Maybe I am not making myself clear. I would like the same menu on the header and footer but different CSS id. To create $menu[2] = 'Foot-Navigation'; it would mean my footer menu will have different page. On the admin I can only assign my menu to top or footer. Is that correct?

[sternchen8875]

i understand...

a simple example.....
you've a div like this around the menu-call

Code: [Select]

<div class="topmenu">

<?php //show_menu(); ?>
            <?php show_menu2(1,SM2_ROOT, SM2_CURR+1, SM2_TRIM,&#39;<li><a href="[url]" class="[class]" title="[page_title]">[menu_title]</a>&#39;, &#39;</li>&#39;,
                                            &#39;<ul>&#39;, &#39;</ul>&#39;,&#39;&#39;,&#39;&#39;, 0);
                            ?>
</div>
copy this menu-code and use a new & different id or class like this for the footermenu

Code: [Select]

<div class="footermenu">

<?php //show_menu(); ?>
            <?php show_menu2(1,SM2_ROOT, SM2_CURR+1, SM2_TRIM,&#39;<li><a href="[url]" class="[class]" title="[page_title]">[menu_title]</a>&#39;, &#39;</li>&#39;,
                                            &#39;<ul>&#39;, &#39;</ul>&#39;,&#39;&#39;,&#39;&#39;, 0);
                            ?>
</div>
if you use a extented version of the menu code like this

Code: [Select]

<div class="w3-right w3-hide-small" id="nav" style="margin-right:20px!important;">
            <?php
            
            $sItemOpen = &#39;<li class="lev[level]  [if(level==0){toplevel w3-border-right w3-large }else{w3-border-0}] w3-hide-small [class]"><a href="[url]" class="[class]"><span>[menu_title]</span></a>&#39;;
                echo show_menu2(
                    $aMenu          = 1,
                    $aStart         = SM2_ROOT,
                    $aMaxLevel      = SM2_ALL,
                    $aOptions       = SM2_ALL|SM2_PRETTY|SM2_BUFFER,
                    $aItemOpen      = $sItemOpen,
                    $aItemClose     = &#39;</li>&#39;,
                    $aMenuOpen      = &#39;<ul style="max-width:250px;">&#39;,
                    $aMenuClose     = &#39;</ul>&#39;,
                    $aTopItemOpen   = false,
                    $aTopMenuOpen   = &#39;<ul id="header_menu" class="menu w3-white">&#39;
                );
            ?>
        </div>
see the ID in the last line ($aTopMenuOpen). Use there a different ID instead of ul id="header_menu"

and in you CSS, you need two definitions, for every class or ID

[apple]

I will give it a go. Thank you.

[apple]

Hi, I copied and paste the code below to index.php file on the footer

<div class="footermenu">
   
         <?php //show_menu(); ?>
            <?php show_menu2(1,SM2_ROOT, SM2_CURR+1, SM2_TRIM,&#39;<li><a href="[url]" class="[class]" title="[page_title]">[menu_title]</a>&#39;, &#39;</li>&#39;,
                                            &#39;<ul>&#39;, &#39;</ul>&#39;,&#39;&#39;,&#39;&#39;, 0);
                            ?>
</div>

and created CSS

}
.footermenu {
  overflow: hidden;
  background-color: none;
  color: #333;
}

etc...

The message below appeared on my index.php page. I am not sure what went wrong. Please help. Thanks.

There was an uncatched exception
syntax error, unexpected token "&", expecting ")"
in line (338) of (/templates/revero/index.php):

[ruebenwurzel]

try it with:

Code: [Select]

<div class="footermenu">
      <?php //show_menu(); ?>
          <?php show_menu2(1,SM2_ROOT, SM2_CURR+1, SM2_TRIM,&#39;<li><a href="[url]" class="[class]" title="[page_title]">[menu_title]</a>&#39;,&#39;</li>&#39;,&#39;<ul>&#39;, &#39;</ul>&#39;,&#39;&#39;,&#39;&#39;, 0);
     ?>
</div>
&#39; is the HTML-Entity for an Apostroph '

[ruebenwurzel]

I see just, that the forums Software seems always to convert the Apostroph to an HTML-Entity in Code-View. So here the code as text:

*****
<div class="footermenu">
      <?php //show_menu(); ?>
          <?php show_menu2(1,SM2_ROOT, SM2_CURR+1, SM2_TRIM,'<li><a href="[url]" class="[class]" title="[page_title]">[menu_title]</a>','</li>','<ul>', '</ul>','','', 0);
     ?>
</div>
****

[sternchen8875]

sorry for the trouble and thanks for the "correct" code   

[apple]

My top menu I gave the id  ".nav-menu" and the footer id is ".footermenu" But somehow my footer menu is still reading from the top menu CSS. What have I done wrong?

Top Menu
.nav-menu,
.nav-menu * {
  margin: 0;
  padding: 0;
  list-style: none;
}

etc...

Footer Menu
.footermenu {
  overflow: hidden;
  color: #febd01;
}

etc...

[ruebenwurzel]

Hello,

your menu calls uses both the same classes.

CLASS           ATTACHED TO
    ------------    -------------------------------------------------------
    menu-top        First menu tag only
    menu-parent     Every parent menu item of the current page.
    menu-current    Only the menu item for the current page.
    menu-sibling    Every sibling of the current page.
    menu-child      Every sub-menu of the current page.
    menu-expand     Every menu item with children.
    menu-first      First item in any menu or sub-menu.
    menu-last       Last item in any menu or sub-menu.

look at the doku in modules/show_menu2/DOC

Please check your .css if this classes are configured. If yes, both menu calls use this classes. If you wanna have different classes for the menues you can configure the show_menu2 call to use your own classes. You also can adapt your css files. f.e.

Code: [Select]

.class .class {}
.nav-menu .menu-current {color: #ffffff;}
.footermenu .menu-current {color: #000000;}

[apple]

Sorry, I dont understand what you mean by using the same class. The ID are different, so how can it be reading from the same class. I am sure I am not understanding it correctly.

The CSS I generated and attached here is intended to generate basic horizontal footer links with submenus. I know it's wrong, but I'm not sure where it has gone wrong.

Thanks.

[crnogorac081]

Hi, is there a possibility to post your project online ? There are several free hosting peoviders. Its hard to help like this

[ruebenwurzel]

Sorry, I dont understand what you mean by using the same class. The ID are different, so how can it be reading from the same class. I am sure I am not understanding it correctly.

The CSS I generated and attached here is intended to generate basic horizontal footer links with submenus. I know it's wrong, but I'm not sure where it has gone wrong.

Thanks.

You use classes and no ID's in your css. Classes start with '.', ID's with '#'
https://www.w3schools.com/html/html_id.asp

[apple]

You use classes and no ID's in your css. Classes start with '.', ID's with '#'
https://www.w3schools.com/html/html_id.asp

Thank you, got it fixed now.