wake-up-neo.net

Kontaktseite 'Alphabet Bar'

Joomla 3.6.5

Ich möchte eine "Alphabetische Leiste" auf meiner Kontaktseite anzeigen, der Menüelementtyp ist Kontakte in einer Kategorie auflisten.

Ich habe 150 Kontakte, und sie sind alle in der gleichen Kategorie. Derzeit werden auf meiner Seite insgesamt 20 Kontakte pro Seite angezeigt .

Im Idealfall möchte ich etwas wie die Bar unten haben;

| A | B | C | D | E | F | G | H | I | J | K | L | M | N | O..

Die Bar könnte auf zwei Arten funktionieren, nehme ich an.

  1. Wenn Sie auf einen Buchstaben klicken, werden auf der Seite die entsprechenden gefilterten Ergebnisse angezeigt.

OR

  1. Ich zeige alle meine Kontakte auf einer einzigen Seite an und wenn ein Buchstabe angeklickt wird, scrollt die Seite automatisch zum entsprechenden Buchstaben.

Ich habe eine Überschreibung in /html/com_contact/category/default_items.php Erstellt, die derzeit wie folgt aussieht.

<?php
/**
 * @package     Joomla.Site
 * @subpackage  com_contact
 *
 * @copyright   Copyright (C) 2005 - 2016 Open Source Matters, Inc. All rights reserved.
 * @license     GNU General Public License version 2 or later; see LICENSE.txt
 */

defined('_JEXEC') or die;
JHtml::_('behavior.core');

$listOrder = $this->escape($this->state->get('list.ordering'));
$listDirn  = $this->escape($this->state->get('list.direction'));

// Create a shortcut for params.
$params = &$this->item->params;

?>

<?php if (empty($this->items)) : ?>
    <p> <?php echo JText::_('COM_CONTACT_NO_CONTACTS'); ?>   </p>
<?php else : ?>

<form action="<?php echo htmlspecialchars(JUri::getInstance()->toString()); ?>" method="post" name="adminForm" id="adminForm">
    <fieldset class="filters">

    <?php if ($this->params->get('show_pagination_limit')) : ?>
        <div class="display-limit">
            <?php echo JText::_('JGLOBAL_DISPLAY_NUM'); ?>&#160;
            <?php echo $this->pagination->getLimitBox(); ?>
        </div>
    <?php endif; ?>
    <input type="hidden" name="filter_order" value="<?php echo $listOrder; ?>" />
        <input type="hidden" name="filter_order_Dir" value="<?php echo $listDirn; ?>" />
    </fieldset>

    <table class="category clergy-contact">
        <?php if ($this->params->get('show_headings')) : ?>
        <thead><tr>
            <th class="item-title">
                <?php echo JHtml::_('grid.sort', 'COM_CONTACT_CONTACT_EMAIL_NAME_LABEL', 'a.name', $listDirn, $listOrder); ?>
            </th>
            <?php if ($this->params->get('show_position_headings')) : ?>
            <th class="item-position">
                <?php echo JHtml::_('grid.sort', 'COM_CONTACT_POSITION', 'a.con_position', $listDirn, $listOrder); ?>
            </th>
            <?php endif; ?>
            <?php if ($this->params->get('show_email_headings')) : ?>
            <th class="item-email">
                <?php echo JText::_('JGLOBAL_EMAIL'); ?>
            </th>
            <?php endif; ?>
            <?php if ($this->params->get('show_telephone_headings')) : ?>
            <th class="item-phone">
                <?php echo JText::_('COM_CONTACT_TELEPHONE'); ?>
            </th>
            <?php endif; ?>

            <?php if ($this->params->get('show_mobile_headings')) : ?>
            <th class="item-phone">
                <?php echo JText::_('COM_CONTACT_MOBILE'); ?>
            </th>
            <?php endif; ?>

            <?php if ($this->params->get('show_fax_headings')) : ?>
            <th class="item-phone">
                <?php echo JText::_('COM_CONTACT_FAX'); ?>
            </th>
            <?php endif; ?>

            <?php if ($this->params->get('show_suburb_headings')) : ?>
            <th class="item-suburb">
                <?php echo JHtml::_('grid.sort', 'COM_CONTACT_SUBURB', 'a.suburb', $listDirn, $listOrder); ?>
            </th>
            <?php endif; ?>

            <?php if ($this->params->get('show_state_headings')) : ?>
            <th class="item-state">
                <?php echo JHtml::_('grid.sort', 'COM_CONTACT_STATE', 'a.state', $listDirn, $listOrder); ?>
            </th>
            <?php endif; ?>

            <?php if ($this->params->get('show_country_headings')) : ?>
            <th class="item-state">
                <?php echo JHtml::_('grid.sort', 'COM_CONTACT_COUNTRY', 'a.country', $listDirn, $listOrder); ?>
            </th>
            <?php endif; ?>

            </tr>
        </thead>
        <?php endif; ?>

        <tbody>
            <?php foreach ($this->items as $i => $item) : ?>
                <tr class="<?php echo ($i % 2) ? "odd" : "even"; ?>" itemscope itemtype="https://schema.org/Person">

                    <td class="item-title">
                        <?php if ($this->items[$i]->published == 0) : ?>
                            <span class="label label-warning"><?php echo JText::_('JUNPUBLISHED'); ?></span>
                        <?php endif; ?>
                        <a href="<?php echo JRoute::_(ContactHelperRoute::getContactRoute($item->slug, $item->catid)); ?>" itemprop="url">
                            <span itemprop="name"><?php echo $item->name; ?></span>
                        </a>
                    </td>

                    <?php if ($this->params->get('show_position_headings')) : ?>
                        <td class="item-position" itemprop="jobTitle">
                            <?php echo $item->con_position; ?>
                        </td>
                    <?php endif; ?>

                    <?php if ($this->params->get('show_email_headings')) : ?>
                        <td class="item-email" itemprop="email">
                            <?php echo $item->email_to; ?>
                        </td>
                    <?php endif; ?>

                    <?php if ($this->params->get('show_telephone_headings')) : ?>
                        <td class="item-phone" itemprop="telephone">
                            <?php echo $item->telephone; ?>
                        </td>
                    <?php endif; ?>

                    <?php if ($this->params->get('show_mobile_headings')) : ?>
                        <td class="item-phone" itemprop="telephone">
                            <?php echo $item->mobile; ?>
                        </td>
                    <?php endif; ?>

                    <?php if ($this->params->get('show_fax_headings')) : ?>
                        <td class="item-phone" itemprop="faxNumber">
                            <?php echo $item->fax; ?>
                        </td>
                    <?php endif; ?>

                    <?php if ($this->params->get('show_suburb_headings')) : ?>
                        <td class="item-suburb" itemprop="address" itemscope itemtype="https://schema.org/PostalAddress">
                            <span itemprop="addressLocality"><?php echo $item->suburb; ?></span>
                        </td>
                    <?php endif; ?>

                    <?php if ($this->params->get('show_state_headings')) : ?>
                        <td class="item-state" itemprop="address" itemscope itemtype="https://schema.org/PostalAddress">
                            <span itemprop="addressRegion"><?php echo $item->state; ?></span>
                        </td>
                    <?php endif; ?>

                    <?php if ($this->params->get('show_country_headings')) : ?>
                        <td class="item-state" itemprop="address" itemscope itemtype="https://schema.org/PostalAddress">
                            <span itemprop="addressCountry"><?php echo $item->country; ?></span>
                        </td>
                    <?php endif; ?>
                </tr>
            <?php endforeach; ?>

        </tbody>
    </table>

        <?php if ($this->params->get('show_pagination', 2)) : ?>
            <div class="pagination">
                <?php if ($this->params->def('show_pagination_results', 1)) : ?>
                    <p class="counter">
                        <?php echo $this->pagination->getPagesCounter(); ?>
                    </p>
                <?php endif; ?>
                <?php echo $this->pagination->getPagesLinks(); ?>
            </div>
        <?php endif; ?>

</form>
<?php endif; ?>

Könnte jemand beraten, wie ich dies erreichen kann?

Ich habe den folgenden Artikel gelesen, aber es bezieht sich auf Kategorien und nicht auf Kontakte.

joomla-3.xoverridescontact
3
jonboy

Ok, also in Ihrem Override, in den Zeilen 47 und 49 , Sie werde sehen <li> Stichworte. Fügen Sie in beiden das folgende Datenattribut hinzu:

data-category="<?php echo substr($this->escape($item->name), 0, 1); ?>"

Dann sehen Sie in Zeile 111 das schließende </ul> Etikett. Fügen Sie direkt darunter Folgendes hinzu, um Ihre Alphabet-Liste zu erstellen:

<?php
    $alphas = range('A', 'Z');
    foreach ($alphas  as $item)
    {
        echo '<a href="#" data-alpha="' . $item . '">' . $item . '</a> | ';
    }
?>

Direkt darunter können Sie mit JS die Kategorie basierend auf dem angeklickten Buchstaben ein-/ausblenden:

<?php
    JFactory::getDocument()->addScriptDeclaration("
        jQuery(document).ready(function($) {
            $('a[data-alpha]').on('click', function(e) {
                e.preventDefault();

                $('[data-category]').hide();

                $('[data-category=\"' + $(this).attr('data-alpha') + '\"]').show();
            });
        });
    ");
?>

Hier ist eine Vorschau:

enter image description here

Hoffe das hilft

3
Lodder

Ich weiß, dass dies keine direkte Antwort auf Ihre Frage ist, aber es gibt ein kostenloses Modul, das genau das tut, was Sie wollen:

http://www.aftercube.com/demo/free-extensions/ac-contacts

Prost!

2
pippo8765

Ich habe auch ein paar Änderungen an Lodder's exzellentem Post vorgenommen, um wieder alle Gegenstände aufzulisten:

echo '| <a href="#" data-alpha="000">All</a> | ';
$alphas = range('A', 'Z');
foreach ($alphas as $item)
{
    echo '<a href="#" data-alpha="' . $item . '">' . $item . '</a> | ';
}

und für das JS-Skript:

JFactory::getDocument()->addScriptDeclaration("
    jQuery(document).ready(function($) {
        $('a[data-alpha]').on('click', function(e) {
            e.preventDefault();

            if ($(this).attr('data-alpha') === '000') {
                $('[data-category]').show();
            } else {
                $('[data-category]').hide();
                $('[data-category=\"' + $(this).attr('data-alpha') + '\"]').show();
           }
       });
   });
");
1
drilippi