Support community for TTG plugins and products.
NOTICE
The Turning Gate's Community has moved to a new home, at https://discourse.theturninggate.net.
This forum is now closed, and exists here as a read-only archive.
You are not logged in.
Pages: 1
Font Awesome has some new icons I want to use, and I can access them by putting their script in the page contents:
<script defer src="https://use.fontawesome.com/releases/v5.0.8/js/all.js"></script>
I want the new 5.0.8 version available across all Backlight, rather than just individual pages one by one. Tried several approaches in custom PHPlugins and CSS, but can't seem to get it working. Just how can I accomplish this upgrade?
Mike Richards
michaelrichardsphotography.com
Offline
which hook are you using in phplugins?
Can you post the function you’re using?
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
I'm not using phplugins or hooks, only the script posted in my original post. That is the function that works as long as I add it in the Page Copy of the Page I'm using. I tried using custom phplugins, but no couldn't seem to get it working. I need to know how to set it up properly.
I understand if I got it right somehow, I could call the phplugin from the individual page template. That's helpful since there are currently only two pages where I want to use the updated Font Awesome. But I want to use it in menus also. How can I do this? There doesn't seem to be a way to call phplugins from menu templates.
Mike Richards
michaelrichardsphotography.com
Offline
you need to invoke phplugins from the page template under Advanced Set up.
http://backlight.theturninggate.net/doc … _phplugins
I would first try using the ttg_scripts hook
But you could also try the ttg_head hook
there are several several phplugins files in the backlight/custom/phplugins/ folder that you can use as reference. Be sure to use a plain text editor when editing the phplugins files.
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
After some struggle, I finally figured out the phplugins route with the following:
// Basic structure for a PHPlugins function
function ttg_scripts( $style, $path ) {
echo '
<script defer src="https://use.fontawesome.com/releases/v5.0.8/js/all.js"></script>
';
return false;
} // END /**/
That's OK for pages, but how do I get menus to accept it?
Mike Richards
michaelrichardsphotography.com
Offline
The page template controls basically everything, including the menus. By using that function in a phplugins file that's used on the page template, it will insert the font-awesome script, making those fonts available to any page that uses that page template or any album template or album set template that uses that page template.
Looking at the source code on your site, I don't see that the font-awesome script is being called.
Are you applying the phplugins file to your page template?
Did you start with one of the sample phplugins files?
Did you comment out the line at the top of the example functions that says: DELETE THIS LINE?
(and are you including everything that comes before that line?)
Using the ttg_scripts hook works just fine. I just added it to my test site and added the font-awesome (5.0) home icon to my menu
http://pangolin.barbeephoto.com/
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
I had been calling the font-awesome script only on the 2 pages I used for "Bibliography" and "Links". It worked on those and affected the menu the way I wanted. None of my other pages called it, and the menus on those pages did not have the font awesome icons I wanted.
I believe what you're suggesting that I should call the script on every one of my 15 page templates. This will probably work, but seems inelegant, so I tried another approach by calling the script within the menu template. I added the script in the name box of the first menu item, as follows:
<script defer src="https://use.fontawesome.com/releases/v5.0.8/js/all.js"></script> <i class="fas fa-home" fa-lg></i> Home
This seems to call the script every time for the menu, and doesn't require phplugin activation on individual pages. The script ensures that pages that use it work properly.
If there's a better way, I would like to know it. It would be nice if phplugin and css activation were included in menu templates. Perhaps in some future upgrade.
Mike Richards
michaelrichardsphotography.com
Offline
Why are you using 15 page templates?
It sounds to me that you’re over complicating this.
The main reason to have more than one page template is if you need pages that have different styling (colors, fonts, etc.)
If your site has a consistent look for all pages you only need one page template. Page templates can serve as many pages, album templates, and album set templates as you like.
http://ttg-tips-and-tricks.barbeephoto. … templates/
And even if you’re using multiple page templates, it’s only a matter of a couple of clicks to add a phplugins file to the page template. This is probably way better than injecting script directly into the menu html.
If there's a better way, I would like to know it. It would be nice if phplugin and css activation were included in menu templates. Perhaps in some future upgrade.
There are no such things as "menu templates." There are menu sets that are available to Page Templates. Phplugins and custom css affect the Page Template. And the Page Template affects the overall styling of the page. This includes the fonts, colors, spacing etc, of menus.
Phplugins and custom css files can add customization to the entire page, not just the menus. It would over complicate things to have phplugins files for each section of a page.
So the very easiest and simplest thing to do is to put that script in a phplugins file, activate phplugins for the page template, and choose that phplugins file.
if you need help with the phplugins file, let us know. It should be just a matter of taking one of the samples, and adding the code you've already posted above.
For my phplugins file I removed any sample functions I didn't need and saved the file with a new name.
Then FTP your file to your site into the phplugins folder at /backlight/custom/phplugins.
In your page template(s), under Advanced Customization, enable phplugins and choose the file you just uploaded.
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Another reason to minimize the use of page templates: Speed! The web browser caches files such as CSS. So when you visit a page that uses a CSS file that was previously used, it is not downloaded again but taken from the cache memory. But each page template has its own specific CSS file. So when each page uses its own page template, you lose the benefit of this acceleration because for each page the web browser has to download this specific CSS file again.
Daniel Leu | Photography
DanielLeu.com
My digital playground (eg, Backlight tips&tricks): lab.DanielLeu.com
Offline
Of course I am aware of Font Awesome 5. I funded it on Kickstarter, and I have a Font Awesome Pro license.
However, Pangolin was designed with Font Awesome 4.7.0, and that version is fairly integral to pangolin's various components. It would not be a simple task for me to upgrade pangolin to Font Awesome 5.
I don't think it's a great idea to load both 4.7.0 and 5 at the same time.
I'm not sure whether loading Font Awesome 5 via JS will create any conflict with the older version. Because the "fa" prefix has been depreciated in version 5, it may be fine to run both side-by-side, apart from having to load two full sets of resources. Loading two full sets of resources, though, is hardly ideal.
If there's only a few specific icons you're wanting to use, then you might have better success pulling the SVGs and using them inline. That's what I'm doing in the recent Galleria Add-on, the only pangolin module that uses Font Awesome 5 icons. I'm not loading the whole thing, though; I just pulled the SVG source for the items I wanted to use in the slideshow; you can see the source by viewing the page source in your browser; it's at the bottom.
http://theturninggate.net/galleries/01- … a-default/
Offline
rod: "Why are you using 15 page templates?
It sounds to me that you’re over complicating this."
OK, followed suggestions and cut down to 10 page templates, mostly by eliminating unused ones. My site has 9,674 images plus videos and rather long text passages including external links and a bibliography. I use 3 color schemes (white, dark, black) depending on what I'm doing. Add pallet positioning/sizing (left, right, none, narrow, wide, etc.) and a few other twists, and it takes all 10 pages to make it work the way I want.
I did get rid of the script in the menu item, and set it up within ttg_head on my phplugin, then activated on every page template. It works ok.
matthew, thanks for the ideas. For now, I'll try to keep it simple by using phplugins.
Mike Richards
michaelrichardsphotography.com
Offline
Pages: 1