Menu icon Foundation

Developer | San Diego, CA

I am a retired mathematician. I have built and maintained two websites using Zurb Foundation as a hobby.

My Posts









My Comments

George Benthien commented on Carolyn Lee's post about 1 month

The code below illustrates the approach I use. You can go to my website https://gbenthien.net to see how it works.
<nav>
<!-- off-canvas title bar for 'small' screen -->
<div class="data-sticky-container" data-sticky-container>
<div class="sticky" data-sticky data-sticky-on="small" data-options="marginTop: 0;">
<div class="title-bar" data-responsive-toggle="widemenu" data-hide-for="medium">
<div class="title-bar-left">
<button class="menu-icon" type="button" data-open="offCanvasLeft"></button>
<span class="title-bar-title">Menu</span>
</div>
<div class="title-bar-right"></div>
</div>
</div>
</div>

<!-- off-canvas left menu for "small" screen -->
<div class="off-canvas position-left" id="offCanvasLeft" data-off-canvas>
<button class="close-button" aria-label="Close menu" type="button" data-close>
<span aria-hidden="true">&times;</span>
</button>
<ul class="vertical menu">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>

<!-- "top-bar menu for 'medium' and up -->
<div data-sticky-container>
<div id="widemenu" class="top-bar" data-sticky data-options="marginTop:0;">
<div class="top-bar-left">
<ul class="menu dropdown" data-dropdown-menu data-close-on-click-inside="false">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
You also need to wrap your page content inside of <div class="off-canvas-content" data-off-canvas-content> ...</div>. I hope this helps 
 

George Benthien commented on Carolyn Lee's post about 1 month

The code below shows the method I use. you can see an example o my web site https://gbnthien.net
<nav>
<!-- off-canvas title bar for 'small' screen -->
<div class="data-sticky-container" data-sticky-container>
<div class="sticky" data-sticky data-sticky-on="small" data-options="marginTop: 0;">
<div class="title-bar" data-responsive-toggle="widemenu" data-hide-for="medium">
<div class="title-bar-left">
<button class="menu-icon" type="button" data-open="offCanvasLeft"></button>
<span class="title-bar-title">Menu</span>
</div>
<div class="title-bar-right"></div>
</div>
</div>
</div>

<!-- off-canvas left menu for "small" screen -->
<div class="off-canvas position-left" id="offCanvasLeft" data-off-canvas>
<button class="close-button" aria-label="Close menu" type="button" data-close>
<span aria-hidden="true">&times;</span>
</button>
<ul class="vertical menu">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>

<!-- "top-bar menu for 'medium' and up -->
<div data-sticky-container>
<div id="widemenu" class="top-bar" data-sticky data-options="marginTop:0;">
<div class="top-bar-left">
<ul class="menu dropdown" data-dropdown-menu data-close-on-click-inside="false">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>
</div>
</div>
</nav>

George Benthien commented on Carolyn Lee's post about 1 month

The type of code I use is shown below. you can see how it works on my web site https://gbenthien.net .
<nav>
<!-- off-canvas title bar for 'small' screen -->
<div class="data-sticky-container" data-sticky-container>
<div class="sticky" data-sticky data-sticky-on="small" data-options="marginTop: 0;">
<div class="title-bar" data-responsive-toggle="widemenu" data-hide-for="medium">
<div class="title-bar-left">
<button class="menu-icon" type="button" data-open="offCanvasLeft"></button>
<span class="title-bar-title">Menu</span>
</div>
<div class="title-bar-right"></div>
</div>
</div>
</div>

<!-- off-canvas left menu for "small" screen -->
<div class="off-canvas position-left" id="offCanvasLeft" data-off-canvas>
<button class="close-button" aria-label="Close menu" type="button" data-close>
<span aria-hidden="true">&times;</span>
</button>
<ul class="vertical menu">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>

<!-- "top-bar menu for 'medium' and up -->
<div data-sticky-container>
<div id="widemenu" class="top-bar" data-sticky data-options="marginTop:0;">
<div class="top-bar-left">
<ul class="menu dropdown" data-dropdown-menu data-close-on-click-inside="false">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
 The offcanvas menu does overlap the content.
 
 
 
 
 
 
 
 
i

George Benthien commented on Carolyn Lee's post about 1 month

The type of code I use is shown below. you can see how it works on my web site https://gbenthien.net .
<nav>
<!-- off-canvas title bar for 'small' screen -->
<div class="data-sticky-container" data-sticky-container>
<div class="sticky" data-sticky data-sticky-on="small" data-options="marginTop: 0;">
<div class="title-bar" data-responsive-toggle="widemenu" data-hide-for="medium">
<div class="title-bar-left">
<button class="menu-icon" type="button" data-open="offCanvasLeft"></button>
<span class="title-bar-title">Menu</span>
</div>
<div class="title-bar-right"></div>
</div>
</div>
</div>

<!-- off-canvas left menu for "small" screen -->
<div class="off-canvas position-left" id="offCanvasLeft" data-off-canvas>
<button class="close-button" aria-label="Close menu" type="button" data-close>
<span aria-hidden="true">&times;</span>
</button>
<ul class="vertical menu">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>

<!-- "top-bar menu for 'medium' and up -->
<div data-sticky-container>
<div id="widemenu" class="top-bar" data-sticky data-options="marginTop:0;">
<div class="top-bar-left">
<ul class="menu dropdown" data-dropdown-menu data-close-on-click-inside="false">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
 
 
 
 
 
 
 
 
 
i

George Benthien commented on Carolyn Lee's post about 1 month

The type of code I use is shown below. you can see how it works on my web site https://gbenthien.net .
<nav>
<!-- off-canvas title bar for 'small' screen -->
<div class="data-sticky-container" data-sticky-container>
<div class="sticky" data-sticky data-sticky-on="small" data-options="marginTop: 0;">
<div class="title-bar" data-responsive-toggle="widemenu" data-hide-for="medium">
<div class="title-bar-left">
<button class="menu-icon" type="button" data-open="offCanvasLeft"></button>
<span class="title-bar-title">Menu</span>
</div>
<div class="title-bar-right"></div>
</div>
</div>
</div>

<!-- off-canvas left menu for "small" screen -->
<div class="off-canvas position-left" id="offCanvasLeft" data-off-canvas>
<button class="close-button" aria-label="Close menu" type="button" data-close>
<span aria-hidden="true">&times;</span>
</button>
<ul class="vertical menu">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>

<!-- "top-bar menu for 'medium' and up -->
<div data-sticky-container>
<div id="widemenu" class="top-bar" data-sticky data-options="marginTop:0;">
<div class="top-bar-left">
<ul class="menu dropdown" data-dropdown-menu data-close-on-click-inside="false">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
 
 
 
 
 
 
 
 
 
i

George Benthien commented on Carolyn Lee's post about 1 month

The type of code I use is shown below. you can see how it works on my web site https://gbenthien.net .
<nav>
<!-- off-canvas title bar for 'small' screen -->
<div class="data-sticky-container" data-sticky-container>
<div class="sticky" data-sticky data-sticky-on="small" data-options="marginTop: 0;">
<div class="title-bar" data-responsive-toggle="widemenu" data-hide-for="medium">
<div class="title-bar-left">
<button class="menu-icon" type="button" data-open="offCanvasLeft"></button>
<span class="title-bar-title">Menu</span>
</div>
<div class="title-bar-right"></div>
</div>
</div>
</div>

<!-- off-canvas left menu for "small" screen -->
<div class="off-canvas position-left" id="offCanvasLeft" data-off-canvas>
<button class="close-button" aria-label="Close menu" type="button" data-close>
<span aria-hidden="true">&times;</span>
</button>
<ul class="vertical menu">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>

<!-- "top-bar menu for 'medium' and up -->
<div data-sticky-container>
<div id="widemenu" class="top-bar" data-sticky data-options="marginTop:0;">
<div class="top-bar-left">
<ul class="menu dropdown" data-dropdown-menu data-close-on-click-inside="false">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
 
 
 
 
 
 
 
 
 
i

George Benthien commented on Carolyn Lee's post about 1 month

The code below illustrates what 
 
The type of code I use is shown below. you can see how it works on my web site https://gbenthien.net .
<nav>
<!-- off-canvas title bar for 'small' screen -->
<div class="data-sticky-container" data-sticky-container>
<div class="sticky" data-sticky data-sticky-on="small" data-options="marginTop: 0;">
<div class="title-bar" data-responsive-toggle="widemenu" data-hide-for="medium">
<div class="title-bar-left">
<button class="menu-icon" type="button" data-open="offCanvasLeft"></button>
<span class="title-bar-title">Menu</span>
</div>
<div class="title-bar-right"></div>
</div>
</div>
</div>

<!-- off-canvas left menu for "small" screen -->
<div class="off-canvas position-left" id="offCanvasLeft" data-off-canvas>
<button class="close-button" aria-label="Close menu" type="button" data-close>
<span aria-hidden="true">&times;</span>
</button>
<ul class="vertical menu">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>

<!-- "top-bar menu for 'medium' and up -->
<div data-sticky-container>
<div id="widemenu" class="top-bar" data-sticky data-options="marginTop:0;">
<div class="top-bar-left">
<ul class="menu dropdown" data-dropdown-menu data-close-on-click-inside="false">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
 
 
 
 
 
 
 
 
 
i

George Benthien commented on George Benthien's post 2 months

One way around this problem is to introduce a variable named php and test on that. Here is a sample
{{#if php}}
{{> phpvars}}
{{/if}}
Then set php to true in the front matter of the php files. For example
---
php: true
---
It is not necessary to set php in the remaining html files as the default value for php is false.

George Benthien commented on George Benthien's post 4 months

With just the page name the test has always only worked for html files and that is still true. The test used to work with php files if you included the .php extension on the file name. Now even that doesn't work.

George Benthien commented on George Benthien's post 11 months

I found that you need to change the :before element and not the :after element.  Here is the SCSS code to replace the +/- accordion toggle with up down triangles
.accordion-title
{
&:before {
content: "\25BC";
}
.is-active > &:before {
content: "\25B2";
}
}

Posts Followed



  • NEW
  • Wrapping top-bar does not work.

    By anish mehta

    top-bar

    Hello! &nbsp; When I am trying to wrap the contents in top-bar-left or right, it does not work as intended. I found this issue with version 6.4.1 of Foundation. But it works fine on v.6.3.1. But if I wrap the whole top-bar it works fine albeit it does n... (continued)


Following

    No Content

Followers

My Posts

My Comments

You commented on Carolyn Lee's post about 1 month

The code below illustrates the approach I use. You can go to my website https://gbenthien.net to see how it works.
<nav>
<!-- off-canvas title bar for 'small' screen -->
<div class="data-sticky-container" data-sticky-container>
<div class="sticky" data-sticky data-sticky-on="small" data-options="marginTop: 0;">
<div class="title-bar" data-responsive-toggle="widemenu" data-hide-for="medium">
<div class="title-bar-left">
<button class="menu-icon" type="button" data-open="offCanvasLeft"></button>
<span class="title-bar-title">Menu</span>
</div>
<div class="title-bar-right"></div>
</div>
</div>
</div>

<!-- off-canvas left menu for "small" screen -->
<div class="off-canvas position-left" id="offCanvasLeft" data-off-canvas>
<button class="close-button" aria-label="Close menu" type="button" data-close>
<span aria-hidden="true">&times;</span>
</button>
<ul class="vertical menu">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>

<!-- "top-bar menu for 'medium' and up -->
<div data-sticky-container>
<div id="widemenu" class="top-bar" data-sticky data-options="marginTop:0;">
<div class="top-bar-left">
<ul class="menu dropdown" data-dropdown-menu data-close-on-click-inside="false">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
You also need to wrap your page content inside of <div class="off-canvas-content" data-off-canvas-content> ...</div>. I hope this helps 
 

You commented on Carolyn Lee's post about 1 month

The code below shows the method I use. you can see an example o my web site https://gbnthien.net
<nav>
<!-- off-canvas title bar for 'small' screen -->
<div class="data-sticky-container" data-sticky-container>
<div class="sticky" data-sticky data-sticky-on="small" data-options="marginTop: 0;">
<div class="title-bar" data-responsive-toggle="widemenu" data-hide-for="medium">
<div class="title-bar-left">
<button class="menu-icon" type="button" data-open="offCanvasLeft"></button>
<span class="title-bar-title">Menu</span>
</div>
<div class="title-bar-right"></div>
</div>
</div>
</div>

<!-- off-canvas left menu for "small" screen -->
<div class="off-canvas position-left" id="offCanvasLeft" data-off-canvas>
<button class="close-button" aria-label="Close menu" type="button" data-close>
<span aria-hidden="true">&times;</span>
</button>
<ul class="vertical menu">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>

<!-- "top-bar menu for 'medium' and up -->
<div data-sticky-container>
<div id="widemenu" class="top-bar" data-sticky data-options="marginTop:0;">
<div class="top-bar-left">
<ul class="menu dropdown" data-dropdown-menu data-close-on-click-inside="false">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>
</div>
</div>
</nav>

You commented on Carolyn Lee's post about 1 month

The type of code I use is shown below. you can see how it works on my web site https://gbenthien.net .
<nav>
<!-- off-canvas title bar for 'small' screen -->
<div class="data-sticky-container" data-sticky-container>
<div class="sticky" data-sticky data-sticky-on="small" data-options="marginTop: 0;">
<div class="title-bar" data-responsive-toggle="widemenu" data-hide-for="medium">
<div class="title-bar-left">
<button class="menu-icon" type="button" data-open="offCanvasLeft"></button>
<span class="title-bar-title">Menu</span>
</div>
<div class="title-bar-right"></div>
</div>
</div>
</div>

<!-- off-canvas left menu for "small" screen -->
<div class="off-canvas position-left" id="offCanvasLeft" data-off-canvas>
<button class="close-button" aria-label="Close menu" type="button" data-close>
<span aria-hidden="true">&times;</span>
</button>
<ul class="vertical menu">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>

<!-- "top-bar menu for 'medium' and up -->
<div data-sticky-container>
<div id="widemenu" class="top-bar" data-sticky data-options="marginTop:0;">
<div class="top-bar-left">
<ul class="menu dropdown" data-dropdown-menu data-close-on-click-inside="false">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
 The offcanvas menu does overlap the content.
 
 
 
 
 
 
 
 
i

You commented on Carolyn Lee's post about 1 month

The type of code I use is shown below. you can see how it works on my web site https://gbenthien.net .
<nav>
<!-- off-canvas title bar for 'small' screen -->
<div class="data-sticky-container" data-sticky-container>
<div class="sticky" data-sticky data-sticky-on="small" data-options="marginTop: 0;">
<div class="title-bar" data-responsive-toggle="widemenu" data-hide-for="medium">
<div class="title-bar-left">
<button class="menu-icon" type="button" data-open="offCanvasLeft"></button>
<span class="title-bar-title">Menu</span>
</div>
<div class="title-bar-right"></div>
</div>
</div>
</div>

<!-- off-canvas left menu for "small" screen -->
<div class="off-canvas position-left" id="offCanvasLeft" data-off-canvas>
<button class="close-button" aria-label="Close menu" type="button" data-close>
<span aria-hidden="true">&times;</span>
</button>
<ul class="vertical menu">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>

<!-- "top-bar menu for 'medium' and up -->
<div data-sticky-container>
<div id="widemenu" class="top-bar" data-sticky data-options="marginTop:0;">
<div class="top-bar-left">
<ul class="menu dropdown" data-dropdown-menu data-close-on-click-inside="false">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
 
 
 
 
 
 
 
 
 
i

You commented on Carolyn Lee's post about 1 month

The type of code I use is shown below. you can see how it works on my web site https://gbenthien.net .
<nav>
<!-- off-canvas title bar for 'small' screen -->
<div class="data-sticky-container" data-sticky-container>
<div class="sticky" data-sticky data-sticky-on="small" data-options="marginTop: 0;">
<div class="title-bar" data-responsive-toggle="widemenu" data-hide-for="medium">
<div class="title-bar-left">
<button class="menu-icon" type="button" data-open="offCanvasLeft"></button>
<span class="title-bar-title">Menu</span>
</div>
<div class="title-bar-right"></div>
</div>
</div>
</div>

<!-- off-canvas left menu for "small" screen -->
<div class="off-canvas position-left" id="offCanvasLeft" data-off-canvas>
<button class="close-button" aria-label="Close menu" type="button" data-close>
<span aria-hidden="true">&times;</span>
</button>
<ul class="vertical menu">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>

<!-- "top-bar menu for 'medium' and up -->
<div data-sticky-container>
<div id="widemenu" class="top-bar" data-sticky data-options="marginTop:0;">
<div class="top-bar-left">
<ul class="menu dropdown" data-dropdown-menu data-close-on-click-inside="false">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
 
 
 
 
 
 
 
 
 
i

You commented on Carolyn Lee's post about 1 month

The type of code I use is shown below. you can see how it works on my web site https://gbenthien.net .
<nav>
<!-- off-canvas title bar for 'small' screen -->
<div class="data-sticky-container" data-sticky-container>
<div class="sticky" data-sticky data-sticky-on="small" data-options="marginTop: 0;">
<div class="title-bar" data-responsive-toggle="widemenu" data-hide-for="medium">
<div class="title-bar-left">
<button class="menu-icon" type="button" data-open="offCanvasLeft"></button>
<span class="title-bar-title">Menu</span>
</div>
<div class="title-bar-right"></div>
</div>
</div>
</div>

<!-- off-canvas left menu for "small" screen -->
<div class="off-canvas position-left" id="offCanvasLeft" data-off-canvas>
<button class="close-button" aria-label="Close menu" type="button" data-close>
<span aria-hidden="true">&times;</span>
</button>
<ul class="vertical menu">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>

<!-- "top-bar menu for 'medium' and up -->
<div data-sticky-container>
<div id="widemenu" class="top-bar" data-sticky data-options="marginTop:0;">
<div class="top-bar-left">
<ul class="menu dropdown" data-dropdown-menu data-close-on-click-inside="false">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
 
 
 
 
 
 
 
 
 
i

You commented on Carolyn Lee's post about 1 month

The code below illustrates what 
 
The type of code I use is shown below. you can see how it works on my web site https://gbenthien.net .
<nav>
<!-- off-canvas title bar for 'small' screen -->
<div class="data-sticky-container" data-sticky-container>
<div class="sticky" data-sticky data-sticky-on="small" data-options="marginTop: 0;">
<div class="title-bar" data-responsive-toggle="widemenu" data-hide-for="medium">
<div class="title-bar-left">
<button class="menu-icon" type="button" data-open="offCanvasLeft"></button>
<span class="title-bar-title">Menu</span>
</div>
<div class="title-bar-right"></div>
</div>
</div>
</div>

<!-- off-canvas left menu for "small" screen -->
<div class="off-canvas position-left" id="offCanvasLeft" data-off-canvas>
<button class="close-button" aria-label="Close menu" type="button" data-close>
<span aria-hidden="true">&times;</span>
</button>
<ul class="vertical menu">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>

<!-- "top-bar menu for 'medium' and up -->
<div data-sticky-container>
<div id="widemenu" class="top-bar" data-sticky data-options="marginTop:0;">
<div class="top-bar-left">
<ul class="menu dropdown" data-dropdown-menu data-close-on-click-inside="false">
<li>
<a href="file1.html">item1</a>
</li>
<li>
<a href="file2.html">item2</a>
</li>
<li>
<a href="file3.html">item3</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
 
 
 
 
 
 
 
 
 
i

You commented on George Benthien's post 2 months

One way around this problem is to introduce a variable named php and test on that. Here is a sample
{{#if php}}
{{> phpvars}}
{{/if}}
Then set php to true in the front matter of the php files. For example
---
php: true
---
It is not necessary to set php in the remaining html files as the default value for php is false.

You commented on George Benthien's post 4 months

With just the page name the test has always only worked for html files and that is still true. The test used to work with php files if you included the .php extension on the file name. Now even that doesn't work.

You commented on George Benthien's post 11 months

I found that you need to change the :before element and not the :after element.  Here is the SCSS code to replace the +/- accordion toggle with up down triangles
.accordion-title
{
&:before {
content: "\25BC";
}
.is-active > &:before {
content: "\25B2";
}
}

Posts Followed

Following

  • No Content

Followers