Teammitglieder online
Support-Box
Neue Beiträge seit dem letzten Besuch.
Textbausteine des MODERATIONSTOOL
AB > PFAD > GENERATOR
FORUM > PFAD > GENERATOR
Unterstützung Lösungs-Probleme
Auffällige
User
Der Runde
Tisch
HÄUFIG GESTELLTE FRAGEN
Regeln und nützliche Hinweise
Neueste Themen
» [phpBB2] Avatare überlappen sich
von Joost Mo 16 Mai 2022 - 14:51

» [phpBB3] servimg - keine Bilder zu sehen
von Joost Sa 14 Mai 2022 - 8:56

» Erhaltet ab sofort Benachrichtigen von Forumieren-Foren auf eurem Discord Server
von Joost Sa 7 Mai 2022 - 10:28

» Logo Bewertungen
von Skouliki Mi 4 Mai 2022 - 19:25

» Präfix im mehrere Farben
von Joost Mo 2 Mai 2022 - 20:59

» Passwort vergessen
von Skouliki Fr 29 Apr 2022 - 20:44

» Seite von forumieren... funtioniert seit Wochen nicht mehr ... https://www.forumieren.de/verze
von Skouliki Fr 29 Apr 2022 - 15:50

» Ankündigungen im Kalender
von Skouliki Fr 29 Apr 2022 - 15:47

» in einem Forum ein Webshop integrieren geht das?
von Skouliki Fr 29 Apr 2022 - 15:24

» Forenverzeichnis Forumieren
von Joost Mi 27 Apr 2022 - 16:16

» Neues YAMAHA XT660-Forum
von gnadenlos Mo 25 Apr 2022 - 22:21

» Gründerpasswort vergessen
von Joost Mo 25 Apr 2022 - 15:41

» Das Ding mit dem Besucherzähler & gefällt mir Buttons_ Zeitgleiche Änderung
von Joost So 24 Apr 2022 - 12:32

» Avatarbild seit neusten nur noch 64 KB groß
von Joost Do 21 Apr 2022 - 14:09

» Seit neusten selbstständige Downloads auf unserer Forenseite
von Joost Do 21 Apr 2022 - 14:07

» Keine Erinnerung an Domain-Verlängerung erhalten
von Joost Do 21 Apr 2022 - 13:58

» Passwort vergessen
von Joost Mo 18 Apr 2022 - 9:49

» Passwort vergessen
von Joost Di 12 Apr 2022 - 14:47

Beiträge mit den meisten Reaktionen des Monats
» Beitrag von KainsAngel in [phpBB2] Avatare überlappen sich
( 2 )


» Beitrag von Skouliki in Logo Bewertungen
( 1 )


» Beitrag von KainsAngel in [phpBB2] Avatare überlappen sich
( 1 )


» Beitrag von Skouliki in [phpBB2] Avatare überlappen sich
( 1 )


» Beitrag von KainsAngel in [phpBB2] Avatare überlappen sich
( 1 )


Ändere das Aussehen deiner Like-/Dislike-Buttons

Vorheriges Thema anzeigen Nächstes Thema anzeigen Nach unten

Tutorial Ändere das Aussehen deiner Like-/Dislike-Buttons

Beitrag von Joost Di 29 März 2022 - 14:09

Ändere das Aussehen deiner Like-/Dislike-ButtonsTUTORIAL



Hallo zusammen. Das folgende Tutorial soll euch helfen das Aussehen der neuen „Gefällt mir“-Buttons zu ändern.

FUNKTIONIERT FÜR DIE FOLGENDEN FOREN-VERSIONEN:


Ändere das Aussehen deiner Like-/Dislike-Buttons Icon_thumleftPunBB
Ändere das Aussehen deiner Like-/Dislike-Buttons Icon_thumleftPhpBB2
Ändere das Aussehen deiner Like-/Dislike-Buttons Icon_thumleftPhpbb3
Ändere das Aussehen deiner Like-/Dislike-Buttons Icon_thumleftInvision
Ändere das Aussehen deiner Like-/Dislike-Buttons Icon_thumleftModernBB
Ändere das Aussehen deiner Like-/Dislike-Buttons Icon_thumleftAwesomeBB

Vorher:
Ändere das Aussehen deiner Like-/Dislike-Buttons Captu372

Nachher:
Ändere das Aussehen deiner Like-/Dislike-Buttons Captu371

ADMINISTRATIONS-BEREICH EINSTELLUNGEN


Ändere das Aussehen deiner Like-/Dislike-Buttons N116 Logge dich mit dem Gründeraccount ein und gehe zu:
Administrations-Bereich Ändere das Aussehen deiner Like-/Dislike-Buttons 2924924668 Anzeige Ändere das Aussehen deiner Like-/Dislike-Buttons 2924924668 Bilder und Farben Ändere das Aussehen deiner Like-/Dislike-Buttons 2924924668 Farben Ändere das Aussehen deiner Like-/Dislike-Buttons 2924924668 CSS-Stylesheet Ändere das Aussehen deiner Like-/Dislike-Buttons 2924924668

Ändere das Aussehen deiner Like-/Dislike-Buttons N217 Kopiert den CCS-Code für euer Forum und fügt sie dort ein.

CSS Codes


PunBB, PhpBB2 & Phpbb3 CSS Code:


Invision CSS Files:
Code:
.fa_like_div {margin-left: 0px;}button.rep-button.fa_like, button.rep-button.fa_dislike,button.rep-button.fa_liked,button.rep-button.fa_disliked{  background: linear-gradient(rgb(49, 49, 49)0%,rgb(49, 49, 49)100%);  border: 1px solid #2c2c2c !important;  box-shadow: 0 0 0 1px #2B2B2B inset;}.rep-button, .rep-button:active, .rep-button:focus {    border: 1px solid #2c2c2c;    border-radius: 4px;    color: #C2C2C2;    cursor: pointer;    float: left;    font-family: Trebuchet MS;    font-size: 12px;    font-weight: 700;    line-height: 1.5;    margin: 3px 11px 0 0;    outline: none;    padding: 6px 10px 6px 10px;    position: relative;    text-transform: uppercase;    transition: color .4s;    background-color: #2e2e2e;} button.rep-button.fa_liked{  color: #4CAF50;  border: 1px solid #2c2c2c;    border-radius: 4px;    float: left;    font-family: Trebuchet MS;    font-size: 12px;    font-weight: 700;    line-height: 1.5;    margin: 3px 11px 0 0;    outline: none;    padding: 6px 10px 6px 10px;    position: relative;    text-transform: uppercase;    transition: color .1s;    background-color: #2e2e2e;  opacity: 1 !important;  pointer-events: auto;  cursor: pointer;}button.rep-button.fa_dislike{  color: #C2C2C2;  border: 1px solid #2c2c2c;    border-radius: 4px;    float: left;    font-family: Trebuchet MS;    font-size: 12px;    font-weight: 700;    line-height: 1.5;    margin: 3px 11px 0 0;    outline: none;    padding: 6px 10px 6px 10px;    position: relative;    text-transform: uppercase;    transition: color .1s;    background-color: #2e2e2e;  opacity: 1 !important;  cursor: pointer;}button.rep-button.fa_disliked{  color: #F44336 !important;  border: 1px solid #2c2c2c;    border-radius: 4px;    float: left;    font-family: Trebuchet MS;    font-size: 12px;    font-weight: 700;    line-height: 1.5;    margin: 3px 11px 0 0;    outline: none;    padding: 6px 10px 6px 10px;    position: relative;    text-transform: uppercase;    transition: color .1s;    background-color: #2e2e2e;  opacity: 1 !important;  pointer-events: auto;  cursor: pointer;}.fa_liked path {    fill: #4CAF50;  }.rep-button{    border: 1px solid #2c2c2c;    border-radius: 4px;    color: #C2C2C2;    cursor: pointer;    float: left;    font-family: Trebuchet MS;    font-size: 12px;    font-weight: 700;    line-height: 1.5;    margin: 3px 11px 0 0;    outline: none;    padding: 6px 10px 6px 10px;    position: relative;    text-transform: uppercase;    transition: color .4s;    background-color: #2e2e2e;}.rep-button:hover{opacity: 0.8;transition-duration: .5s;} .rep-button svg {    color: #4ab01c;    font-size: 20px;    text-shadow: 0 0 1px #FFF;    padding: 4px 3px 6px 7px;    background-color: #e1e1e1;    margin: -5px 1px -5px -9px;  margin-right: 7px !important;  border-radius: 2px 0px 0px 2px;} .rep-button{  height: 32px;}


ModernBB CSS Files:


AwesomeBB CSS Files:


Ihr könnt die Farbe selbst ändern, um sie an eure eigenes Forendesign anzupassen.

Ändere das Aussehen deiner Like-/Dislike-Buttons N316 Vergesst nicht zu speichern

Wenn Ihr eure Mitglieder davon abhalten möchtet, die Likes oder Dislikes zu entfernen, sobald sie gedrückt wurden, könnt Ihr den folgenden Teil der CSS-Dateien heraussuchen und ändern.
Findet:

Code:
pointer-events: auto;

Ersetzt diese mit:

Code:
pointer-events: none;

Wenn Ihr irgendwelche Probleme habt, öffnet bitte ein neues Thema und bittet um Hilfe. Stellet sicher, dass ihr eure Foren-URL und einen Link zu diesem Thema angebt.

Wir hoffen, dass euch dieser tolle kleine Tutorial gefällt, wie Sie die Änderung vornehmen können.

Euer Team von Forumieren king
Joost
Joost
Administrator
Administrator

Männlich Beiträge : 619
Anmeldedatum : 29.12.12
Ändere das Aussehen deiner Like-/Dislike-Buttons Empty
Google Chrome phpBB3

Vanity mag diesen Beitrag

Nach oben Nach unten

Vorheriges Thema anzeigen Nächstes Thema anzeigen Nach oben

- Ähnliche Themen

 
Befugnisse in diesem Forum
Sie können in diesem Forum nicht antworten