[TikiWiki-commits] [Git][tikiwiki/tiki][24.x] [ENH] Pagetop Hero Module: Enhance breadcrumb functionality with custom text and URL support.

Alvin Bauma pushed to branch 24.x at Tiki Wiki CMS Groupware / Tiki


Commits:
2d41c49c by Alvin Bauma at 2026-01-05T13:24:40+01:00
[ENH] Pagetop Hero Module: Enhance breadcrumb functionality with custom text and URL support.
---
* [ENH] Pagetop Hero Module: Enhance breadcrumb functionality with custom text and URL support.
---
* [ENH] Pagetop Hero Module: Enhance breadcrumb functionality with custom text and URL support.

See merge request tikiwiki/tiki!9307

See merge request tikiwiki/tiki!9308

- - - - -


2 changed files:

- + modules/mod-func-pagetop_hero.php
- + templates/modules/mod-pagetop_hero.tpl


Changes:

=====================================
modules/mod-func-pagetop_hero.php
=====================================
@@ -0,0 +1,116 @@
+<?php
+
+// (c) Copyright by authors of the Tiki Wiki CMS Groupware Project
+//
+// All Rights Reserved. See copyright.txt for details and a complete list of authors.
+// Licensed under the GNU LESSER GENERAL PUBLIC LICENSE. See license.txt for details.
+
+/**
+ * @return array
+ */
+function module_pagetop_hero_info()
+{
+    return [
+        'name' => tr('Page Topbar Hero'),
+        'description' => tr('An easy page-top hero section located in Tiki\'s topbar module zone'),
+        'params' => [
+            'pagetitle' => [
+                'required' => false,
+                'name' => tr('Page title'),
+                'description' => tr('Page title'),
+            ],
+            'description' => [
+                'required' => false,
+                'name' => tr('Page description'),
+            ],
+            'breadcrumbs' => [
+                'required' => false,
+                'name' => tr('Breadcrumbs'),
+                'description' => tr('Allows you to specify the navigation paths to arrive at the current page. Separate items with commas. Use pipe (|) to specify custom text and URL: "Text|URL".'),
+            ],
+            'breadcrumbs_auto_link' => [
+                'required' => false,
+                'name' => tr('Breadcrumbs auto-link'),
+                'description' => tr('Automatically convert breadcrumb items to links. When enabled, each item becomes a link to itself unless pipe (|) is used to override. (y|n)'),
+                'default' => 'n'
+            ],
+            'content_position' => [
+                'required' => false,
+                'name' => tra('Content position'),
+                'description' => tra('Content position inside the hero image'),
+                'default' => 'center',
+                'filter' => 'alpha',
+                'options' => [
+                    ['text' => tra('Center'), 'value' => 'center'],
+                    ['text' => tra('Left-Center'), 'value' => 'leftcenter'],
+                    ['text' => tra('Top-Left'), 'value' => 'topleft'],
+                    ['text' => tra('Top-Center'), 'value' => 'topcenter'],
+                    ['text' => tra('Top-Right'), 'value' => 'topright'],
+                    ['text' => tra('Bottom-Left'), 'value' => 'bottomleft'],
+                    ['text' => tra('Bottom-Center'), 'value' => 'bottomcenter'],
+                    ['text' => tra('Bottom-Right'), 'value' => 'bottomright'],
+                ],
+            ],
+            'bgimage' => [
+                'required' => false,
+                'name' => tra('Page Topbar Hero background image URL'),
+                'description' => tra('Enter image URL, in the case of a single image.'),
+            ],
+            'usepagename' => [
+                'required' => false,
+                'name' => tr('Use page title'),
+                'description' => tra('Allows the page title to be used as title of the pagetop module (y|n)'),
+                'default' => 'n'
+            ]
+        ]
+    ];
+}
+
+/**
+ * @param $mod_reference
+ * @param $module_params
+ */
+function module_pagetop_hero($mod_reference, $module_params)
+{
+    $smarty = TikiLib::lib('smarty');
+
+    $pagetitle = '';
+    $breadcrumbs = [];
+    $auto_link = isset($module_params["breadcrumbs_auto_link"]) && $module_params["breadcrumbs_auto_link"] == 'y';
+
+    if (isset($module_params["usepagename"]) && $module_params["usepagename"] == 'y') {
+        $pagetitle = $_REQUEST['page'] ?? '';
+        $breadcrumbs[] = ['text' => tra("Home"), 'url' => null];
+        $breadcrumbs[] = ['text' => $pagetitle, 'url' => null];
+    } else {
+        $pagetitle = $module_params["pagetitle"] ?? '';
+        if (! empty($module_params["breadcrumbs"])) {
+            $items = explode(",", $module_params["breadcrumbs"]);
+            foreach ($items as $item) {
+                $item = trim($item);
+                if (strpos($item, '|') !== false) {
+                    // Item has pipe: Text|URL
+                    list($text, $url) = explode('|', $item, 2);
+                    $breadcrumbs[] = ['text' => trim($text), 'url' => trim($url)];
+                } else {
+                    // Item without pipe
+                    if ($auto_link) {
+                        $breadcrumbs[] = ['text' => $item, 'url' => $item];
+                    } else {
+                        $breadcrumbs[] = ['text' => $item, 'url' => null];
+                    }
+                }
+            }
+            // Add page title as last breadcrumb (non-clickable)
+            if (! empty($pagetitle)) {
+                $breadcrumbs[] = ['text' => $pagetitle, 'url' => null];
+            }
+        }
+    }
+
+    $smarty->assign('pagetitle', $pagetitle);
+    $smarty->assign('description', $module_params["description"] ?? '');
+    $smarty->assign('content_position', $module_params["content_position"] ?? 'center');
+    $smarty->assign('breadcrumbs', $breadcrumbs);
+    $smarty->assign('bgimage', $module_params["bgimage"] ?? '');
+}


=====================================
templates/modules/mod-pagetop_hero.tpl
=====================================
@@ -0,0 +1,202 @@
+{tikimodule error=$module_error title=$tpl_module_title name=$tpl_module_name flip=$module_params.flip decorations=$module_params.decorations nobox=$module_params.nobox notitle=$module_params.notitle}
+<div id="pagetop-hero" class="pagetop-hero w-100 p-4">
+    <div class="bg-image-wrapper" id="bg-image-wrapper" {if $bgimage neq ''}style="background-image: url('{$bgimage}')"{/if}></div>
+    <div class="row">
+        <div class="content">
+            <h1 class="pagetop-hero-title">{tr}{$pagetitle|escape}{/tr}</h1>
+            {if count($breadcrumbs) gt 0}
+                <ol class="breadcrumb">
+                    {foreach from=$breadcrumbs item=item name=object }
+                        {if $smarty.foreach.object.last}
+                            <li class="breadcrumb-item active" aria-current="page">{tr}{$item.text}{/tr}</li>
+                        {else}
+                            <li class="breadcrumb-item">
+                                {if $item.url neq null && $item.url neq ''}
+                                    <a href="{$item.url|escape}"><b>{tr}{$item.text|escape}{/tr}</b></a>
+                                {else}
+                                    {tr}{$item.text}{/tr}
+                                {/if}
+                            </li>
+                        {/if}
+                    {/foreach}
+                </ol>
+            {else}
+                {if $description neq ''}
+                    <p class="pagetop-hero-description">{tr}{$description|escape}{/tr}</p>
+                {/if}
+            {/if}
+        </div>
+    </div>
+</div>
+{/tikimodule}
+
+<style>
+    /* Pagetop Hero */
+    .pagetop-hero {
+        -webkit-box-shadow: 0px 5px 16px 2px rgba(68, 68, 68, 0.58);
+        box-shadow: 0px 5px 16px 2px rgba(68, 68, 68, 0.58);
+        min-height: 300px;
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+
+    .pagetop-hero-title,
+    .breadcrumb,
+    .pagetop-hero-description {
+        text-align: center
+    }
+
+
+    .pagetop-hero .bg-image-wrapper {
+        min-height: 300px;
+        max-width: 100%;
+        overflow: hidden;
+    }
+
+    .pagetop-hero .row {
+        z-index: 1;
+        width: 100% !important;
+    }
+
+    .pagetop-hero .row .pagetop-hero-title {
+        flex-wrap: wrap !important;
+        color: #fff;
+        width: 100%;
+    }
+
+    .bg-image-wrapper {
+        position: absolute;
+        top: 0;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        z-index: 0;
+        background-position: center center;
+        background-size: cover;
+        background-color: rgb(60, 60, 60);
+        filter: brightness(65%);
+        -webkit-filter: brightness(65%);
+        -moz-filter: brightness(65%);
+    }
+
+    .breadcrumb,
+    .breadcrumb a,
+    .breadcrumb .breadcrumb-item,
+    .breadcrumb .breadcrumb-item.active {
+        color: #fff !important;
+        background-color: transparent !important;
+    }
+
+    .breadcrumb a:hover {
+        color: #ddd !important;
+        text-decoration: underline;
+    }
+
+    .pagetop-hero .breadcrumb::before {
+        color: #fff !important;
+    }
+
+    .pagetop-hero .breadcrumb-item + .breadcrumb-item::before {
+        color: #fff !important;
+    }
+</style>
+
+{if $content_position eq 'topleft'}
+    <style>
+        .pagetop-hero-title,
+        .breadcrumb,
+        .pagetop-hero-description {
+            text-align: left
+        }
+
+        .pagetop-hero {
+            align-items: flex-start;
+        }
+    </style>
+{/if}
+
+{if $content_position eq 'leftcenter'}
+    <style>
+        .pagetop-hero-title,
+        .breadcrumb,
+        .pagetop-hero-description {
+            text-align: left
+        }
+
+        .pagetop-hero {
+            align-items: center;
+        }
+    </style>
+{/if}
+
+{if $content_position eq 'topcenter'}
+    <style>
+        .pagetop-hero-title,
+        .breadcrumb,
+        .pagetop-hero-description {
+            text-align: center
+        }
+
+        .pagetop-hero {
+            align-items: flex-start;
+        }
+    </style>
+{/if}
+
+{if $content_position eq 'topright'}
+    <style>
+        .pagetop-hero-title,
+        .breadcrumb,
+        .pagetop-hero-description {
+            text-align: right
+        }
+
+        .pagetop-hero {
+            align-items: flex-start;
+        }
+    </style>
+{/if}
+
+{if $content_position eq 'bottomleft'}
+    <style>
+        .pagetop-hero-title,
+        .breadcrumb,
+        .pagetop-hero-description {
+            text-align: left
+        }
+
+        .pagetop-hero {
+            align-items: flex-end;
+        }
+    </style>
+{/if}
+
+{if $content_position eq 'bottomcenter'}
+    <style>
+        .pagetop-hero-title,
+        .breadcrumb,
+        .pagetop-hero-description {
+            text-align: center
+        }
+
+        .pagetop-hero {
+            align-items: flex-end;
+        }
+    </style>
+{/if}
+
+{if $content_position eq 'bottomright'}
+    <style>
+        .pagetop-hero-title,
+        .breadcrumb,
+        .pagetop-hero-description {
+            text-align: right
+        }
+
+        .pagetop-hero {
+            align-items: flex-end;
+        }
+    </style>
+{/if}



View it on GitLab: https://gitlab.com/tikiwiki/tiki/-/commit/2d41c49cef34fe4d2e1b0f4f16ca4ca625c593f9

-- 
View it on GitLab: https://gitlab.com/tikiwiki/tiki/-/commit/2d41c49cef34fe4d2e1b0f4f16ca4ca625c593f9
You're receiving this email because of your account on gitlab.com.

_______________________________________________
TikiWiki-cvs mailing list
[email protected]
https://lists.sourceforge.net/lists/listinfo/tikiwiki-cvs