Have cms page with link inside category

[claus]

Hi All

I Would have a link inside a category instead a sub-category

Is possbile?

Example:

Category 1

Category 2

•  -->  sub category 1
•  -->  sub category 2
•  -->  sub category 3
• link to cms page

Category 3

I'm using prestashop 1.7 with custom theme

 

 

[Guest]

Where do you want it like this?
In the top menu?
In the left block?
More information and picture.
It is possible.

[Guest]

 

1. open ./themes/your theme/modules/ps_categorytree/views/templates/hook/ps_categorytree.tpl

2. find

{/if}
            {/if}
          </li>
        {/foreach}
      </ul>

3. replace to

{if $node.id == 5}
            <li data-depth="{$depth}">
              <a href="https://mydomain.com/content/1-my-cms-url">my custom url</a>
            </li>
          {/if}

4. change 5 to your category id and change href url to your cms page

{if $node.id == 5}

5. full sample code for two category (category 5 and category 7)

{**
 * 2007-2019 PrestaShop and Contributors
 *
 * NOTICE OF LICENSE
 *
 * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
 * that is bundled with this package in the file LICENSE.txt.
 * It is also available through the world-wide-web at this URL:
 * https://opensource.org/licenses/AFL-3.0
 * If you did not receive a copy of the license and are unable to
 * obtain it through the world-wide-web, please send an email
 * to [email protected] so we can send you a copy immediately.
 *
 * DISCLAIMER
 *
 * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
 * versions in the future. If you wish to customize PrestaShop for your
 * needs please refer to https://www.prestashop.com for more information.
 *
 * @author    PrestaShop SA <contact@prestashop.com>
 * @copyright 2007-2019 PrestaShop SA and Contributors
 * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
 * International Registered Trademark & Property of PrestaShop SA
 *}

{function name="categories" nodes=[] depth=0}
  {strip}
    {if $nodes|count}
      <ul class="category-sub-menu">
        {foreach from=$nodes item=node}
          <li data-depth="{$depth}">
            {if $depth===0}
              <a href="{$node.link}">{$node.name}</a>
              {if $node.children}
                <div class="navbar-toggler collapse-icons" data-toggle="collapse" data-target="#exCollapsingNavbar{$node.id}">
                  <i class="material-icons add">&#xE145;</i>
                  <i class="material-icons remove">&#xE15B;</i>
                </div>
                <div class="collapse" id="exCollapsingNavbar{$node.id}">
                  {categories nodes=$node.children depth=$depth+1}
                </div>
              {/if}
            {else}
              <a class="category-sub-link" href="{$node.link}">{$node.name}</a>
              {if $node.children}
                <span class="arrows" data-toggle="collapse" data-target="#exCollapsingNavbar{$node.id}">
                  <i class="material-icons arrow-right">&#xE315;</i>
                  <i class="material-icons arrow-down">&#xE313;</i>
                </span>
                <div class="collapse" id="exCollapsingNavbar{$node.id}">
                  {categories nodes=$node.children depth=$depth+1}
                </div>
              {/if}
            {/if}
          </li>
          {if $node.id == 5}
            <li data-depth="{$depth}">
              <a href="https://mydomain.com/content/1-my-cms-url">my custom url for category 5</a>
            </li>
          {/if}
        
          {if $node.id == 7}
            <li data-depth="{$depth}">
              <a href="https://mydomain.com/content/2-my-custom-url">my custom url for category 7</a>
            </li>
          {/if}
        {/foreach}
      </ul>
    {/if}
  {/strip}
{/function}

<div class="block-categories hidden-sm-down">
  <ul class="category-top-menu">
    <li><a class="text-uppercase h6" href="{$categories.link nofilter}">{$categories.name}</a></li>
    <li>{categories nodes=$categories.children}</li>
  </ul>
</div>

 

[claus]

right ..it should be like the image where custom not is a category but the link for a page

i replace the code where 23 is the id  of the category but not show on the left menu.

{function name="categories" nodes=[] depth=0}
  {strip}
    {if $nodes|count}
      <ul class="category-sub-menu">
        {foreach from=$nodes item=node}
          <li data-depth="{$depth}">
            {if $depth===0}
              <a href="{$node.link}">{$node.name}</a>
              {if $node.children}
                <div class="navbar-toggler collapse-icons" data-toggle="collapse" data-target="#exCollapsingNavbar{$node.id}">
                  <i class="material-icons add"><svg
                    xmlns="http://www.w3.org/2000/svg"
                    xmlns:xlink="http://www.w3.org/1999/xlink"
                    width="8px" height="4px">
                   <path fill-rule="evenodd"  fill="rgb(7, 7, 7)"
                    d="M4.000,4.000 L0.670,0.500 L7.330,0.500 L4.000,4.000 Z"/>
                   </svg></i>
                  <i class="material-icons remove"><svg
                    xmlns="http://www.w3.org/2000/svg"
                    xmlns:xlink="http://www.w3.org/1999/xlink"
                    width="7px" height="4px">
                   <path fill-rule="evenodd"  fill="rgb(7, 7, 7)"
                    d="M3.500,-0.000 L6.986,4.000 L0.014,4.000 L3.500,-0.000 Z"/>
                   </svg></i>
                </div>
                <div class="collapse" id="exCollapsingNavbar{$node.id}">
                  {categories nodes=$node.children depth=$depth+1}
                </div>
              {/if}
            {else}
              <a class="category-sub-link" href="{$node.link}">{$node.name}</a>
              {if $node.children}
                <span class="arrows" data-toggle="collapse" data-target="#exCollapsingNavbar{$node.id}">
                  <i class="material-icons arrow-right">&#xE315;</i>
                  <i class="material-icons arrow-down">&#xE313;</i>
                </span>
                <div class="collapse" id="exCollapsingNavbar{$node.id}">
                  {categories nodes=$node.children depth=$depth+1}
                </div>
              {/if}
            {/if}
          </li>

          
          {if $node.id == 23}
            <li data-depth="{$depth}">
              <a href="https://www.hrxtech.eu/content/7-custom">Custom Link</a>
            </li>
          {/if}
        
        {/foreach}
      </ul>
    {/if}
  {/strip}
{/function}

[Guest]

Force recompile template and clear cache.

[claus]

nothing...i did but not show and i'm sure the category is the 23 as show on the link

the code must be before {/foreach} ?

 

[claus]

I have found the solution

the right code is :

		{if $categories.id==23} 
			<li data-depth="{$depth}">
			<a href="https://www.hrxstore.eu/content/7-custom">CUSTOM</a>
			</li>		  
		{/if}

i used categories instead the node because the link is inside the first.

thanks for the help