Piwigo::Aanpassen Mobiel Thema
Piwigo Mobiel Thema aanpassen naar wens
Voor het gebruik van Piwigo op een mobile telefoon is het Smartpocket thema beschikbaar.
Door dit thema naast het (standaard)desktopthema, in mijn geval 'elegant', te activeren wordt een mobiel automatisch herkend en wordt 'Smartpocket' gebruikt.
Hacks
Smartpocket bevat enkele bugs en zijn er ook een paar punten die ik graag anders zie.
Piwigo biedt middels de LocalFiles Editor de mogelijkheid de nodige aanpassingen lokaal te doen zonder dat er onnodig gehackt moet worden in de Smartpocket directory.
Helaas zijn er dan nog steeds wijzigingen die alleen maar middels een hack van de 'core' bestanden tot stand gebracht kunnen worden. Daarnaast kunnen templates van plugins niet vervangen worden met de lokale-bestanden methode en zijn hiervoor ook hacks nodig. Zie ook: Can't use templates to override smartpocket theme
Bij hacks is het risico aanwezig dat bij een Piwigo update/upgrade het gehackte bestand vervangen wordt en de wijzigingen zodoende verloren gaan.
Child thema
Beter dan hacks in de stamdaard Piwigo corebestanden en templates is hier het aanmaken van een eigen custom mobiel thema, een 'child' van Smartpocket
Zodoende maken we de wijzigingen zonder daarvoor de Piwigo core en/of thema te hacken.
Let op! : Na een upgrade van het parent theme bestaat het risico dat het child theme niet meer compatible is.
Maak child-thema 'mymobile'
We gaan een eigen 'child' thema maken van het 'parent' thema Smartpocket.
Zie hiervoor ook:
Coding guidelines for creating a theme (child theme or custom theme)
- Maak een nieuwe map ../themes/mymobile (apache:apache 751)
- Maak in map ../mymobile een nieuwe map ../mymobile/template (apache:apache 751)
- Maak in map ../mymobile een nieuwe map ../mymobile/icon (apache:apache 751)
- Maak een nieuw bestand ../mymobile/theme.css (apache:apache 644)
- Maak een nieuw bestand ../mymobile/themeconf.inc.php (apache:apache 644)
- Maak een nieuw bestand ../mymobile/screenshot.png representatief voor je thema
Een thema heeft minstens de 2 bestanden theme.css en themeconfig.php nodig
themeconf.inc.phpIn themeconf.inc.php worden de eigenschappen van het eigen thema 'mymobile' gedefinieerd in zoverre zij afwijken van ../smartpocket/themeconf.inc.php.
In ieder geval bevatten zij de volgende code:
<?php
/*
Theme Name: MyMobile
Version: 0.1
Description: Mobile Theme
Theme URI:
Author: Ben Makkink
Author URI: http://www.makkink.eu
*/
$themeconf = array(
'mobile' => true,
'parent' => 'smartpocket',
'icon_dir' => 'themes/mymobile/icon',
);
//Voeg nieuwe code boven deze regel toe
//=====================================
?>
Het eerste blok zijn comments (tussen /*…*/), maar de code moet de syntax van het voorbeeld volgen. Het comment blok wordt gelezen door Piwigo voor het weergeven van informatie over je thema. 'Theme URI' is voor automatische install/update from http://piwigo.org/ext. Dit werkt alleen als je eigen thema geregistreerd is bij Piwigo. Wij laten deze dus leeg.
Essentiëel is de $themeconf setting: 'parent' => 'smartpocket' . Hiermee wordt bepaald welk thema wordt overschreven door de code van jouw thema.
theme.cssCSS regels alleen voor dit thema. Hier overschrijf je CSS regels dei geerfd worden van eht 'parent' thema.
Hieronder als voorbeeld de inhoud die in de loop van dit hoofdstuk met aanpassingen toegevoegd gaat worden:
/* CSS voor betere weergave van Breadcrumbs
/* Voor het verkleinen van de padding van het contentblok (tussen menubar en footer) */
.ui-content { padding: 2px 15px 1px 15px ;}
/* Voor de positionering van de toegevoegde Breadcrumb in de albumpagina's in index.tpl */
/* Deze wijziging heeft ook invloed op de listview met foto's */
.ui-content .ui-listview-inset { margin: 2px 0 5px 0 ; }
/* CSS Footer font-size van 16 naar 12px */
.ui-footer .ui-title { font-size: 12px;}
Screenshot.png
Als we in dit stadium in Piwigo gaan naar Beheer > Configuratie > Thema's zien we daar het nieuwe thema 'MyMobile' met alsafbeelding een vraagteken.
Maak een representatieve afbeelding met afmetingen 300 x 240px en geef de naam screenshot.png en plaats deze in de map ../theme/mymobile/
Bijvoorbeeld:
Nu ziet de pagina Beheer > Configuratie > Thema's er zo uit:
NOTE: Voor het activeren van MyMobile mag er geen ander mobiel thema geactiveerd zijn.
Wel moet het parent thema Smart Pocket zoals hierboven geïnstalleerd zijn!
Aanpassingen MyMobile thema
Parent/Child systeem
Alle theme.css en themeconf.inc.php bestanden van de parent-thema's worden eerst geladen en als laatste die van het huidige child-thema, die de instellingen van de parent-thema's overschrijven.
De templates worden eerst geladen van het child-thema en daarna worden de in het child-thema ontbrekende templates gehaald bij de parent-thema's. Het systeem werkt recursief.
De hierna volgende aanpassingen maken we in ...mymobile/theme.css, in ../mymobile/themeconf/inc.php en/of in de ../mymobile/templates/ toe te voegen templates.
Favicon weergevenFavicon maken
In het thema Elegant is voorzien in het weergeven van een favicon zoals beschreven in Piwigo::Wijzigingen Desktop Thema
De gebruikte favicon is gemaakt van een afbeelding:
Deze afbeelding is vervolgens geladen naar Favicon & App Icon Generator
Hiervan creëert deze website, naast de gebruikelijke 16 x 16 ico, de diverse formaten App favicons benodigd voor onder andere Apple en Android.
Zie ook deze website: How to add a browser tab icon (favicon) for a website voor de in <head> te gebruiken code voor het plaatsen van de diverse favicons.
Plaats de voor ons doel gewenste pwg-favicon.ico en android-icon-192x192.png in de map ../themes/mymobile/icon.Favicon plaatsen
- Plaats een kopie van ../themes/smartpocket/template/header.tpl in ../themes/mymobile/template/
- Edit ../themes/mymobile/template/header.tpl
- Voeg toe vóór de regel <link rel="start" title="{'Home'|@translate}"href="{$U_HOME}"> :
{* BM 23-02-2020 Voeg links naar Favicons toe in <head> *} <link rel="shortcut icon" type="image/x-icon" href="{$ROOT_URL}{$themeconf.icon_dir}/pwg-favicon.ico"> <link rel="icon" type="image/png" sizes="192x192" href="{$ROOT_URL}{$themeconf.icon_dir}/android-icon-192x192.png"> {* EINDE Favicon link *}
Zie Piwigo Forum Smart Pocket theme displays hidden albums
In het parent-thema Smart Pocket wordt in ../themes/smartpocket/themeconf.inc.php op regel 83 een event_handler gezet voor het event 'loc_end_index_category_thumbnails'.
In de plugin Extended Descriptions wordt in main.inc.php voor dezelfde event een andere actie opgeroepen wat tot een conflict leidt waardoor Extended Descriptions niet goed werkt.
Het probleem is op te lossen door de betreffende event_handler in het parent-thema smartpocket te verwijderen.
Dit kan zonder hacken gedaan worden door de volgende code te plaatsen in ../theme/mymobile/themeconf.inc.php
// BM 22-02-2020 Verwijder event-handler gezet in parent theme.
// Deze conflicteert met een zelfde handler gezet in main.inc.php van de
// plugin ExtendedDescription
add_event_handler( 'init', 'remove_actions_parent_theme');
function remove_actions_parent_theme() {
remove_event_handler('loc_end_index_category_thumbnails', 'sp_select_all_categories');
};
// EINDE Verwijderen event_handler uit parent
Login smartpocket/mymobile
Bij de desktop thema's Pure_Clear_Blue en thema Elegant gebruiken we de plugin PWG-Stuffs om een login-blok weer te geven op de hoofdpagina als er geen publieke albums beschikbaar zijn.
Met Smartpocket werkt de plugin PWG-Stuffs niet.
Om met het parent-thema Smartpocket en child-thema MyMobile toch een inlogblok weer te geven voegen we met een hack code toe aan de Piwigo startpagina ../piwigo/index.php.
Hack in startpagina
In Piwigo::Wijzigingen Desktop Thema is voor het plaatsen van een cookie een hack uitgevoerd in ../piwigo/index.php door hier een 'include' toe te voegen naar een nieuw bestand ../piwigo/include/extra-index.inc.php. Dit nieuwe bestand bestand bevat de feitelijke hack voor het plaatsen van de cookie.
Als er nu een update van Piwigo komt blijft alle code in extra-index.inc.php behouden en is het voldoende de mogelijk missende 'include' statement in index.php opnieuw aan te brengen.
Voeg nu voor het weergeven van het inlogscherm ../piwigo/identification.php onderstaande code toe in extra-index.inc.php .
Klik hier voor de volledige inhoud van dit bestand.
//Ben Makkink 25/01/2020
//Toevoeging voor een redirect naar 'indentification.php' voor het thema
//'Smart Pocket' ter vervanging van het PWG-Stuffs inlog block
//--------------------------------------------------------------------------
if ( (mobile_theme()) and isset($page['is_homepage']) and $page['is_homepage']and $user['status']=="guest" )
{
redirect('identification.php');
}
Attentie:
Als we bovenstaande testen op een desktop dan zal het niet werken omdat het dan niet herkend wordt als een 'mobile theme'.
Na uitloggen is de enige manier om weer naar het inlogscherm te komen de url index.php te vervangen door identification.php
dus in plaats van ../piwigo/index.php ../piwigo/identification.php
Op de Piwigo startpagina heb ik miniaturen (klikplaatjes) geplaatst met een link naar de individuele albums.
Deze miniaturen met link zijn virtuele albums met maar één klik-plaatje (afbeelding). Per default vermeldt Piwigo bij albumminiaturen het aantal foto's in een album.
Bij een miniatuur met link willen we de vermelding '1 foto's' niet.
- Plaats een kopie van ../themes/smartpocket/template/mainpage_categories.tpl in ../themes/mymobile/template/
- Edit ../themes/mymobile/template/mainpage_categories.tpl
- Vervang de regel @L8 <p class="Nb_images">{$cat.CAPTION_NB_IMAGES}</p> door:
{* BM 15-02-2020 verberg bijschrift: '1 foto' *} {if (stristr($cat.CAPTION_NB_IMAGES," ",true)==1) } <p> </p> {else} <p class="Nb_images">{$cat.CAPTION_NB_IMAGES}</p> {/if} {* einde hack BM *}
Bij de desktop thema's was het PWG-Stuffs inlogblok niet geheel naar wens. Hiervoor heb ik de PWG-Stuffs template 'stuffs_logon.tpl' aangepast (Zie hiervoor Piwigo::Aanpassen Desktop Thema )
Bij het mobiele thema Smartpocket wordt de layout van het inlogblok bepaald door de bij 'identification.php' behorende template ../smartpocket/template/identification.tpl
De volgende wijzigingen worden doorgevoerd:
- Voeg toe: button voor annuleren aanmelding
- Verwijder optie: Automatisch aanmelden
- Verwijder optie: Wachtwoord vergeten?
- Verwijder optie: Registreer
- Plaats een kopie van ../themes/smartpocket/template/identification.tpl in ../themes/mymobile/template/
- Edit ../themes/mymobile/template/identification.tpl
- Voeg toe: button voor annuleren aanmelding @L27
<div data-role="fieldcontain"> <input type="hidden" name="redirect" value="{$U_REDIRECT|@urlencode}"> <input type="submit" name="login" value="{'Submit'|@translate}"> {* Hack Ben Makkink 08-01-2017 Voeg button toe voor annuleren login (effectief logout) *} <button formaction="?act=logout">Annuleren</button> {* Einde toevoegen button annuleren login *}
- Verwijder optie: Automatisch aanmelden @L17 door uitmarkeren code
{* BM 15-02-2020 Begin uitmarkering voor verwijderen van 'Automatische aanmelding' {if $authorize_remembering } <div data-role="fieldcontain"> <label for="remember_me">{'Auto login'|@translate}</label> <input type="checkbox" name="remember_me" id="remember_me" value="1"> </div> {/if} Einde uitmarkering 'Automatische aanmelding *}
- Verwijder optie: Wachtwoord vergeten? @L37 door uitmarkeren code
<div data-role="fieldcontain" style="margin-top:2em"> {* Hack Ben Makkink 17-02-2020 Niet tonen van 'Wachtwoord vergeten?' link {if isset($U_LOST_PASSWORD)} <a href="{$U_LOST_PASSWORD}" data-role="button">{'Forgot your password?'|@translate}</a> {/if} EINDE niet tonen van 'Wachtwoord vergeten?' link *}
- Verwijder optie: Registreer @L43 door uitmarkeren code
{* BEGIN niet tonen van Register link {if isset($U_REGISTER)} <a href="{$U_REGISTER}" data-role="button">{'Register'|@translate}</a> {/if} EINDE niet tonen van Register link *}
Op de albumpagina met template 'index.tpl' van Smartpocket wordt per default geen Breadcrumb weergegeven.
De benodigde code is gekopieerd van de fotopagina ('picture.tpl') die zo'n breadcrumb wel heeft.
Aanvullend wordt het domein 'Makkink.eu' toegevoegd aan het begin van de breadcrumb met een 'log-out' link waarmee Piwigo gesloten wordt.
- Plaats een kopie van ../themes/smartpocket/template/index.tpl in ../themes/mymobile/template/
- Edit ../themes/mymobile/template/index.tpl
- Voeg breadcrumb toe na @L1:
<div data-role="content">
{* BM 15-02-2020 BEGIN toevoeging van breadcrumb op albumpagina *}
<ul data-role="listview" data-inset="true">
<li data-role="list-divider"><a href="?act=logout">makkink.eu</a>{$LEVEL_SEPARATOR} {$TITLE}<span class="browsePathSeparator"> {$LEVEL_SEPARATOR}</span>{$current.TITLE} </li> </ul>
{* EINDE toevoeging van breadcrumb *}
- Edit ../themes/mymobile/themes.css en voeg code toe voor het meer compact weergeven van de breadcrumb.
Deze toevoeging heeft ook invloed op de breadcrumb van de fotopagina.
/* CSS voor betere weergave van Breadcrumbs /* Voor het verkleinen van de padding van het contentblok (tussen menubar en footer) */ .ui-content { padding: 2px 15px 1px 15px ;} /* Voor de positionering van de toegevoegde Breadcrumb in de albumpagina's in index.tpl */ /* Deze wijziging heeft ook invloed op de listview met foto's */ .ui-content .ui-listview-inset { margin: 2px 0 5px 0 ; }
In Smartpocket is om onduidelijke redenen de albumbeschrijving na de content onderaan de pagina geplaatst.
Dit wordt gewijzigd door de code voor de beschrijving boven de content met de albums te plaatsen.
- Edit bovenstaande ../themes/mymobile/template/index.tpl
- Kopieer de code startend met {if !empty($CONTENT_DESCRIPTION) } en plak deze voor de content beginnend met {if !empty($CATEGORIES)}{$CATEGORIES}{/if}
- Markeer vervolgens de albumbeschrijving na de content uit.
{* BM 15-02-2020 BEGIN albumbeschrijving bovenaan pagina *} {if !empty($CONTENT_DESCRIPTION)} <div class="additional_info"> {$CONTENT_DESCRIPTION} </div> {/if} {* EINDE albumbeschrijving bovenaan pagina *} {if !empty($CATEGORIES)}{$CATEGORIES}{/if} {if !empty($THUMBNAILS)}{$THUMBNAILS}{/if} {* BM 15-02-2020 BEGIN geen albumbeschrijving onder aan pagina {if !empty($CONTENT_DESCRIPTION)} <div class="additional_info"> {$CONTENT_DESCRIPTION} </div> {/if} EINDE geen albumbeschrijving *}
Net zoals bij de albumpagina hierboven wordt van de fotopagina de template aangepast voor het weergeven van het domein makkink.eu voor de breadcrumb.
- Plaats een kopie van ../themes/smartpocket/template/picture.tpl in ../themes/mymobile/template/
- Edit ../themes/mymobile/template/picture.tpl
- Voeg domeinnaam met log-out link toe @L5:
<ul data-role="listview" data-inset="true"> {* BEGIN toevoeging makkink.eu met logout aan de breadcrumb *} <li data-role="list-divider"><a href="?act=logout">makkink.eu</a>{$LEVEL_SEPARATOR} {$SECTION_TITLE}<span class="browsePathSeparator"> {$LEVEL_SEPARATOR}</span>{$current.TITLE} </li> {*EINDE toevoeging aan breadcrumb *}
Op de fotopagina van Smartpocket is het een rommeltje geworden. Onder de foto zijn navigatieknoppen geplaatst met daaronder de beschrijving van de foto. Vervolgens staan hieronder opnieuw dezelfde navigatieknoppen.
Door het aanpassen van de template wordt één set knoppen naar boven de foto verplaatst en de tweede set knoppen wordt uitgemarkeerd.
- Edit bovenstaande ../themes/mymobile/template/picture.tpl
- Voeg code toe vóór {$ELEMENT_CONTENT} voor het weergeven van de navigatieknoppen @L12 en markeer dezelfde code direct na {$ELEMENT_CONTENT} uit.
{* BEGIN omwisselen Navigatiebuttons en Content, effectief Navigatie boven Foto *} {include file='picture_nav_buttons.tpl'|@get_extent:'picture_nav_buttons'} {$ELEMENT_CONTENT} {* {include file='picture_nav_buttons.tpl'|@get_extent:'picture_nav_buttons'} EINDE omwisselen Navigatiebuttons en Content *} - Markeer tenslotte ook de zelfde code direct na {/if} {*comments*} @L178 uit.
{* BEGIN Uitmarkering duplicaat Navigatie Buttons
include file='picture_nav_buttons.tpl'|@get_extent:'picture_nav_buttons'
EINDE Uitmarkering overtollige NavButtons *}
Onderaan de Miniaturen (Thumbs) pagina is voorzien in 2 navigatieknoppen zijnde voor 'volgende' en 'vorige' pagina.
Hieraan voegen we toe: 'eerste' en 'laatste'
- Plaats een kopie van ../themes/smartpocket/template/navigation_bar.tpl in ../themes/mymobile/template/
- Edit ../themes/mymobile/template/navigation_bar.tpl
- Voeg code toe voor het weergeven van 'Eerste' en 'Laatste' knoppen.
{capture}{$navbar.pages|@end}{/capture} <div data-role="footer" class="ui-bar ui-bar-a" style="text-align:center;"> <div data-role="controlgroup" data-type="horizontal"> {strip} {* BM 21-02-2020 Extra navigatiebutton 'Eerste' *} {if isset($navbar.URL_FIRST)} <a href="{$navbar.URL_FIRST}" rel="first" data-role="button" data-inline="true">{'First'|@translate}</a> {/if} {* EINDE Extra navigatiebutton 'Eerste' *} {if isset($navbar.URL_PREV)} <a href="{$navbar.URL_PREV}" rel="prev" data-role="button" data-icon="arrow-l" data-inline="true">{'Previous'|@translate}</a> {/if} <a href="#" data-role="button" data-inline="true">{$navbar.CURRENT_PAGE} / {$navbar.pages|@key} </a> {if isset($navbar.URL_NEXT)} <a href="{$navbar.URL_NEXT}" rel="next" data-role="button" data-icon="arrow-r" data-iconpos="right" data-inline="true">{'Next'|@translate}</a> {/if} {* BM 21-02-2020 Extra navigatiebutton 'Laatste' *} {if isset($navbar.URL_LAST)} <a href="{$navbar.URL_LAST}" rel="last" data-role="button" data-inline="true"> {'Last'|@translate}</a> {/if} {* EINDE Extra navigatiebutton 'Laatste' *} {/strip} </div> </div>
De Smartpocket footer bevat teveel onnodige informatie voor mijn gebruik.
Door bewerken van de Smartpocket template footer.tpl worden de vermelding 'Mogelijk gemaakt door Piwigo' en 'Mail to webmaster' verwijderd.
- Plaats een kopie van ../themes/smartpocket/template/footer.tpl in ../themes/mymobile/template/
- Edit ../themes/mymobile/template/footer.tpl
- Markeer code uit voor het verwijderen van overbodige mededelingen
{* BM 19-02-2020 Begin uitmarkering voor verwijderen van Powered by en Contact Webmaster>> {$VERSION} {if isset($CONTACT_MAIL)} - {'Contact'|@translate}<a href="mailto:{$CONTACT_MAIL}?subject= {'A comment on your site'|@translate|@escape:url}">{'Webmaster'|@translate}</a> {/if} <br> Einde uitmarkering footer tekst *} - De fontsize in de Smartpocket footer is voor gebruik op een mobiel onbenullig groot.
Edit ../themes/mymobile/themes.css en voeg code toe voor het reduceren van de fontsize in de footer
/* CSS Footer font-size van 16 naar 12px */ .ui-footer .ui-title { font-size: 12px;}
De url van de Home-button 
aan de linkerzijde in de paginaheader verwijst per default terug naar de root van Piwigo, dwz de 'Home' pagina.
Maar als de button aangeklikt wordt terwijl we in de Homepagina zijn gebeurd er ogenschijnlijk niets omdat de url naar zichzelf verwijst.
In het geval we al in de Homepagina zijn willen we dat de Homebutton ons uitlogt en terug verwijst naar de webroot.
- Edit ../themes/mymobile/template/header.tpl
- Vervang in de code de regel @ L58
<a href="{$U_HOME}" class="home_button" data-icon="home" data-iconpos="notext" data-role="button"></a> -
door
{* BM 04-02-2021 Homebutton url *} {if ($PAGE_TITLE == l10n('Home'))} {* Indien op homepage: terug naar webroot via piwigo logout *} <a href="?act=logout" class="home_button" data-icon="home" data-iconpos="notext" data-role="button"></a> {else} {* Vanaf alle andere pagina's: terug naar Piwigo root *} <a href="{$U_HOME}" class="home_button" data-icon="home" data-iconpos="notext" data-role="button"></a> {/if} {* Einde wijziging Homebutton url *}
Toggleknop voor Openen en Sluiten van het Menublok 
Aan de rechterzijde in de headerbalk zien we hiervoor een weinig intuitieve knop met een 'grid' voor het openen en sluiten van een menublok.
Het is meer bekend hiervoor een symbool te gebruiken met 3 horizontale streepjes en deze is zelfs in het SmartPocket thema beschikbaar aangeduid met 'bars' 
.
De 'bars' menuknop wordt getoond door de code in de SmartPocket template header.tpl aan te passen.
- Plaats (als dat voor de favicon nog niet gebeurd is) een kopie van ../themes/smartpocket/template/header.tpl in ../themes/mymobile/template/
- Edit ../themes/mymobile/template/header.tpl
- Vervang in de code 'grid' door 'bars'
{* BM 20-02-2020 Wijzig afbeelding van menubutton 'data-icon=' naar "bars" *} <a href="#menubar" data-icon="bars" data-iconpos="notext" data-role="button" style="float: right" >Menu</a> {* EINDE wijziging buttonafbeelding *}
Het menu-blok zoals in het SmartPocket thema opgezet heeft voor ons gebruik teveel en onnodige opties en de indeling is niet erg intuitief.
Opties in het menu-blok:
 |
SmartPocket default Menu-blok:
MyMobile gewenst Menu-blok:
 |
Elke pagina heeft al in de footer de optie om te switchen tussen het mobiele- en desktop thema.
Het heeft geen toegevoegde waarde dit nog een keer in het menublok te tonen.
- Plaats een kopie van ../themes/smartpocket/template/menubar.tpl in ../themes/mymobile/template/
- Edit ../themes/mymobile/template/menubar.tpl
- Markeer de onderstaande regels code uit:
{* BM 20-02-2020 start uitmarkering optie 'Bureaublad' <br> <ul data-role="listview"> <li data-role="list-divider">{'View in'|@translate}</li> <li><a href="{$TOGGLE_MOBILE_THEME_URL}">{'Desktop'|@translate}</a></li> </ul> EINDE uitmarkering 'Bureaublad' *}
Pas de menubar 'Menu'aan als volgt:
- Voeg 'Aanmelden/Afmelden'en 'Beheer' toe (kopieren uit 'Identificatie')
- Verwijder opties 'Labels', 'Over' en 'Meldingen'. Behoudt 'Zoek'
(De plugin 'Advanced Menu Manager werkt niet in SmartPocket)
- Plaats een kopie van ../themes/smartpocket/template/menubar_menu.tpl in ../themes/mymobile/template/
- Edit ../themes/mymobile/template/menubar_menu.tpl
- Kopieer regels voor 'Aan- en Afmelden' en 'Beheer' uit menubar_identification.tpl en voeg toe aan het begin in menubar_menu.tpl:
<ul data-role="listview">> {* BM HACK 21-02-2020 Voeg Login, Logout en Administration uit menubar_identification.tpl toe *} {if isset($U_LOGIN)}<li><a href="{$U_LOGIN}">{'Login'|@translate}</a></li>{/if} {if isset($U_LOGOUT)}<li><a href="{$U_LOGOUT}">{'Logout'|@translate}</a></li>{/if} {if isset($U_ADMIN)}<li><a href="{$U_ADMIN}">{'Administration'|@translate}</a></li>{/if} {* EINDE toevoeging menu items *} - Voeg in de foreach loop een filter toe en beperk weergave tot de optie 'Zoek'
{* BM HACK 21-02-20 Verberg onnodige menu opties, behoudt alleen 'Zoek' *} {foreach from=$block->data item=link} {if is_array($link)} {if ($link.NAME=="Zoek")} <li> <a href="{$link.URL}" title="{$link.TITLE}"{if isset($link.REL)}
{$link.REL}{/if}>{$link.NAME}</a>{if isset($link.COUNTER)}
<span class="ui-li-count">{$link.COUNTER}</span>{/if} </li> {/if} {/if} {/foreach} {* EINDE filter "Zoek" *}
Van de 'Uitgelicht' menubar verbergen we de opties 'Jouw Favorieten', 'Meest bezocht' en 'Willekeurige Foto's'.
Ook voor deze opties werkt de plugin Advanced Menu Manager niet.
- Plaats een kopie van ../themes/smartpocket/template/menubar_specials.tpl in ../themes/mymobile/template/
- Edit ../themes/mymobile/template/menubar_specials.tpl
- Verwijder de ongewenste opties uit de array:
<h3>{'Specials'|@translate}</h3> <ul data-role="listview"> {foreach $block->data as $key=>$link} {* BM HACK 21-02-2020 Verwijder items uit array {if in_array($key, array("favorites","most_visited","best_rated", "recent_pics","recent_cats","random"))} EN behoud alleen de gewenste items *} {if in_array($key, array("recent_pics","recent_cats"))} <li> <a href="{$link.URL}" title="{$link.TITLE}"{if isset($link.REL)} {$link.REL}{/if}>{$link.NAME}</a> </li> {/if} {/foreach} </ul>
Na het verplaatsen van de opties 'Aan- en Afmelden' en 'Beheer' naar de 'Menu' menu-bar zijn er geen gewenste opties over en we verbergen 'Identificatie'.
Dit doen we door de gehele inoud van menubar_identification.tpl uit te markeren. Omdat de template leeg is zal het niet meer getoond worden.
- Plaats een kopie van ../themes/smartpocket/template/menubar_identification.tpl in ../themes/mymobile/template/
- Edit ../themes/mymobile/template/menubar_identification.tpl
- Markeer alle code uit:
{* BM HACK 21-02-2020 alle code uitgemarkeerd, waardoor menu 'Identificatie' niet getoond wordt <h3>{'Identification'|@translate}</h3> <ul data-role="listview"> {if isset($U_REGISTER)}<li><a href="{$U_REGISTER}">{'Register'|@translate}</a></li>{/if} {if isset($U_LOGIN)}<li><a href="{$U_LOGIN}">{'Login'|@translate}</a></li>{/if} {if isset($U_LOGOUT)}<li><a href="{$U_LOGOUT}">{'Logout'|@translate}</a></li>{/if} {if isset($U_PROFILE)}<li><a href="{$U_PROFILE}">{'Customize'|@translate}</a></li>{/if} {if isset($U_ADMIN)}<li><a href="{$U_ADMIN}">{'Administration'|@translate}</a></li>{/if} </ul> EINDE uitmarkering *}
© Ben Makkink