Collapsible Categories with Cookies

Hier gibt es kleinere Snippets zu phpBB 3.1.x.
Gesperrt
Benutzeravatar
Kirk
Administrator
Offline
Beiträge: 637
Registriert: Di 15. Apr 2014, 10:54
Wohnort: Erde
Geschlecht: Männlich ♂
Kontaktdaten:

Collapsible Categories with Cookies

Dez 2014 20 12:02

Beitrag von Kirk » Sa 20. Dez 2014, 12:02


Erlaubt es den Benutzern jedes einzelne Foren Kategorie zusammenzuklappen.
Die Einstellungen werden per Cookie gespeichert.
Basierend auf den MOD Collapsible Categories with Cookies von Christian Bullock: http://www.christianbullock.com

Öffne: root/styles/prosilver/template/forumlist_body.html

Finde:

Code: Alles auswählen

<!-- BEGIN forumrow -->
Danach einfügen:

Code: Alles auswählen

<div class="forumlist">
Finde:

Code: Alles auswählen

        <!-- IF (forumrow.S_IS_CAT and not forumrow.S_FIRST_ROW) or forumrow.S_NO_CAT  -->
            </ul>
Danach einfügen:

Code: Alles auswählen

</div>
Finde:

Code: Alles auswählen

<ul class="topiclist forums">
Davor einfügen:

Code: Alles auswählen

            <!-- IF SCRIPT_NAME eq 'index' --><div class="trigger active"></div><!-- ENDIF -->
            <div class="collapsethis">
Finde:

Code: Alles auswählen

    <!-- IF forumrow.S_LAST_ROW -->
            </ul>
Danach einfügen:

Code: Alles auswählen

</div>
Finde:

Code: Alles auswählen

<!-- END forumrow -->
Danach einfügen:

Code: Alles auswählen

</div>
Öffne: root/styles/prosilver/template/overall_footer.html

Finde:

Code: Alles auswählen

<!-- EVENT overall_footer_after -->
Danach einfügen:

Code: Alles auswählen

<script type="text/javascript" src="{T_TEMPLATE_PATH}/jquery.cookie.js"></script>
<script type="text/javascript" src="{T_TEMPLATE_PATH}/jquery.collapse.js"></script>

<script type="text/javascript">
        $(".forumlist").collapse({show: function(){
                this.animate({
                    opacity: 'toggle',
                    height: 'toggle'
                }, 300);
            },
            hide : function() {
                   
                this.animate({
                    opacity: 'toggle',
                    height: 'toggle'
                }, 300);
            }
        });
</script>
Öffne: root/styles/prosilver/theme/common.css

Ganz am Ende einfügen:

Code: Alles auswählen

.trigger {
    background: url("./images/collapse-icon.png") no-repeat;
    width: 32px;
    height: 17px;
    cursor: pointer;
    float: right;
    position: relative;
    z-index: 9998;
    margin-top: -21px;
}

.active {background-position: left top;}
.inactive {background-position: left bottom;}
Hinweis:
Nach dem entpacken der Datei collapsible-categories.zip
Kopiere: collapse-icon.png nach root/styles/prosilver/theme/images/
Kopiere: jquery.cookie.js nach root/styles/prosilver/template/
Kopiere: jquery.collapse.js nach root/styles/prosilver/template/

Leere den Cache im "Administrations-Bereich" (ACP) > "Allgemein" > "Den Cache leeren"
Leere deinen Browser Cache
STRG+F5

Download:
collapsible-categories.zip
(7.14 KiB) 70-mal heruntergeladen
Gruß Udo

Gesperrt