Feedback wie der Kommentar zur Diskussion. Des Letzteren scheint im Heute nicht mehr so genützt. Denn es ist ein Abstand vom Kommentieren zu erkennen. … Sei es von wegen, dass das Geschriebene nur unter Umständen zu ändern oder zu widerlegen ist? – bzw. die Zeit nicht da ist. … Das mal ganz ehrlich :-). So bedarf auch ein Beitrag im Kommentar wenig Anmerkung bzw. keiner Debatte, oder sind diese schon geschlossen? Anderes geht meist in Foren ab.
So ist aber eine vom Leser netten Bewertung durch das Feedback-Plug-in Helpful sehr gefragt! Und der Autor fühlt sich gut angenommen, er kann sich in Ruhe von Fragen annehmen oder er muss auch Kritik hinnehmen. … Ein Ideal mag auch sein im sowohl zur Diskussion als auch das Feedback-Plug-in.
Website einbinden, siehe WordPress: ‘Embeds’; und iFrames.
Der erste Eindruck
Wie hier die Gunst der Stunde mit Stern Bewertung ist auf das Feedback-Plug-in Helpful hinzuweisen. Diese Art von Plug-in ermöglicht nur zwei Antworten. In etwa der Frage: War der Beitrag hilfreich? – mit JA oder NEIN zu antworten. Dabei sind individuelle Texte in jeder der Einstellungen ganz leicht zu handhaben. Des Letzteren ist zum Update 4.4.62 entfernt, da es zu viele Probleme mit der Metabox gab.
Vorerst zu den Bewertungen des Plug-ins von Kevin P. … Mittlerweile ist es auf sehr seriösen Websites zu sehen.
Für den Anwender ist das Plug-in ‚Helpful‘ von Kevin P. Alias Pixelbart, der Funktion von Plug-in ‚Rate my Post‘ ähnlich. Aber dem Output von ‚Rate my Post sind es in ‚Helpful‘ gerade mal 10 % an Ressource.
Die Einstellungen, das Anpassen
Das Plug-in Helpful ist sehr gut vorbereitet. Die Einstellungen lassen keine Wünsche offen. Infolge deiner Anpassung gereicht es zur Vollendung! Wobei dies alles sehr übersichtlich und sich selbst erklärend ist.
Dashboard / Helpful und mit ‚Einstellungen‘ zur Menüzeile.
Im Folgenden das Tab-Menü. Von Tab 1 bis Tab 4 ist das der Einstellungen und das nächst ab Tab 5 ist zum Individuellen.
Die Funktionen
[tabbylink tab=1 offset=100 fade=400]Tab 1: Menü Details, das mit der ‚Meta Box‘ und Menü Texte u. a. die Zeile ‚Nach der Abstimmung.[/tabbylink]
[tabbylink tab=2 offset=100 fade=400]Tab 2: Menü Feedback, das in Zeile ‚Bereits abgestimmt‘ und so das Formular immer zeigen.[/tabbylink]
[tabbylink tab=3 offset=100 fade=400]Tab 3: Weiter in Menü Feedback, das mit der Zeile ‚E-Mails‘.[/tabbylink]
[tabbylink tab=4 offset=100 fade=400]Tab 4: Dann im Ersten kurz zum Menü System das mit der ‚Transients API‘ und dem Cache; im Zweiten dann das mit den Cookies samt DSGVO. Indem Interviews mit Kevin P.[/tabbylink]
Das Individuelle
[tabbylink tab=5 offset=100 fade=400 class=tabbylinkclass]Tab 5: Menü Design / CSS wie hier zum Beispiel.[/tabbylink]
[tabbylink tab=6 offset=100 fade=400 class=tabbylinkclass]Tab 6: FAQ, das Ankerziel zum Feedback-Formular von den Meta
aus. [/tabbylink]
[tabbylink tab=7 offset=100 fade=400 class=tabbylinkclass]Tab 7: FAQ, ein ‚Individuelles Feld‘ im Feedback-Plug-in Helpful; …auch mit so Dekoration. [/tabbylink]
[tabbylink tab=8 offset=100 fade=400 class=tabbylinkclass]Tab 8: FAQ, die Reihung von Feedback-Plug-in Helpful und bspw Plug-in WordPress Related Posts. [/tabbylink]
[tabby title=“1″]
Menü Details
… das ist sich selbst erklärend. So bleibt noch das Häkchen in Zeile Meta-Box zu aktivieren. Das ist zwar eine Option, die zum Einstieg nicht relevant ist und nur nach der Logik von der Menüzeile hier am Anfang steht.
Zeile ‚Meta Box‘
Soweit dem Häkchen zur Meta-Box ist dann im jeweiligen Beitrag die Box Helpful. Da ist zu sehen, wie viele Stimmen für den aktuellen Beitrag sind usw. Es können hier auch die Stimmen für den aktuellen Beitrag zurückgesetzt werden. Das geht dort im Boxbereich über die ‚Individuelle Felder‘ bzw. ‚Benutzerdefinierte Felder‘ bei ClassicPress.
Zur Erinnerung, das im Editor für den Boxbereich ist re. o. ‚Ansicht anpassen‘.
Weiter sind dem Beitrag die Texte auch anzupassen. Das Bspw ist hier im Bild oben. nach den Änderungen wäre die Überschrift noch anzupassen. Also die Texte sind dann anders als wie folgend in Menü Texte definiert.
Zeile ‚Dashboard Widget‘
Weiter ist für das WP-Dashboard auch ein sehr schönes Widget zu aktivieren. S. Menü Details der Zeile ‚Dashboard Widget‘.
Menü Texte
Das unter Menü Texte ist weitgehend sich selbst erklärend 🙂 Bleibt noch das mit …
Helpful-Tags
Diese Schnipsel sind im Text einzufügen, damit man nicht per Hand die Anzahl der Stimmen usw. in den Texten einfügen muss. … wenn man das so möchte.
Bspw lässt sich mit {pro} die Anzahl der positiven Stimmen anzeigen. Also die Anzahl der Pro-Stimmen für den Beitrag. Das ist u. a. für die Textabschnitte, die nun folgen.
Zeile ‚Nach der Abstimmung‘ im Menü Texte
In dem Textabschnitt ist zu schreiben …
→ Nach der Abstimmung (Pro) und (Kontra)
So Vorlage:
<strong>Vielen Dank für deine Stimme!</strong><br><br>
So die Woche das Votum: <br>{pro} Leut für "Ja!" – und {contra} Leut "Nein!". <br>Indes dem Beitrag hier {total} Votum. <br>Also wie Pro {pro_percent} % : {contra_percent} % Contra
Im Nächsten, da ist etwas acht zu geben:
→ Bereits abgestimmt
Das in etwa:
Das mit dem Text da ist dann visuell und eine Mitteilung ist im Nachhinein nicht mehr gegeben.
- Dazu ist gleich zur Unterscheidung zum Menü Feedbacks zu weisen. S. nächst Titel. Nämlich das zu den Einstellungen von auch ‚Bereits abgestimmt‘.
Das Obige zum Bild ist nur anzuwenden, wenn das unter Menü Feedback / Zeile ‚Bereits abgestimmt‘ ∴nicht∴ angehakt wird:
Diese beiden ‚Bereits abgestimmt‘ unterscheiden sich ob. Wenn nämlich folgend unter Menü Feedback das Häkchen bei ‚Bereits abgestimmt‘ angehakt ist. Zufolge wird das hier unter Menü Texte ohne Funktion. Dabei ist das dann vom Wortlaut inhaltlich zu unterscheiden.
[tabbylink tab=2 offset=100 fade=400 ]Nächst Tab zum Menü Feedback, die Zeile ‚Formular‘ und Zeile ‚Bereits abgestimmt‘.[/tabbylink]
[tabby title=“2″]
Menü Feedback
Nun das mit der Unterscheidung von ‚Bereits abgestimmt‘. S. Tab eins.
Zeile ‚Formular‘
Unter Feedback / erste Zeile ‚Formular‘. Dort ist das → ‚Formular nach pos./neg. Abstimmung anzeigen‘ zu aktivieren. Infolge ist in der Zeile ‚Bereits abgestimmt‘ das Häkchen sehr zu betonen. Ob dem Häkchen ist, als dass sooft in Wiederkehr der Seite auch das Formular da ist. Somit ist auch im Nachhinein das Sagen noch möglich. Also dann…
Zeile ‚Bereits abgestimmt‘
Da in Zeile ‚Bereits abgestimmt‘ ist das Häkchen zum → Das Formular immer zeigen…
Da ist auch der Text zu schreiben, gemäß zur evtl. Wiederkehr des Besuchs.
Das Features ist nun wie bei den Kommentaren. Um evtl. nochmals einen Eintrag in das Formular zu schreiben. Dort ist dann zur Wiederkehr selber Seite auch im Nachhinein das Sagen noch möglich. Im Falle Browser zurück ist aber die Seite neu zu laden.
Das Formular ist dann so:
Evtl. die Frage … Wie sind in WordPress die Kommentare zu deaktivieren?
Sofern …
- Das Features zum ‚Bereits abgestimmt‘ ist noch mal so konkret im Titel Plug-in Helpful und das von Feedback J/N ändern?
[tabbylink tab=3 offset=100 fade=400 ]Weiter in Menü Feedback, das mit der Zeile ‚E-Mails‘.[/tabbylink]
[tabby title=“3″]
Menü Feedback
Zeile ‚E-Mails‘
Hier geht es um die Kopie des Feedbacks per E-Mail.
Erst zu den Feedbacks nur der Abstimmung zum JA / NEIN. Die sind im Dashboard Widget und unter Helpful / Einstellungen → ‚Start‘ auch ‚Protokoll‘ zu sehen. Doch die Feedbacks von Mitteilung sind unter Helpful / Feedback. Wobei aber keine E-Mail-Adresse vom Absender aufscheint. Infolge ist das hier Beschriebene nur an mehr für die Kopie des Feedbacks per E-Mail.
Da sind nun mal unter Menü Feedback der Zeile ‚Formular‘ und ‚E-Mails‘ je ein Häkchen zu erklären.
Erstens, das im Menü Feedback in Zeile ‚Formular‘
Im Ersten geht es darum, wenn der Besucher in das Formular schreibt und mit E-Mail-Adresse die Nachricht sendet. So erhält man die Nachricht wie unter Dashboard / Helpful > Feedback auch per E-Mail. Und nur dort per E-Mail ist die E-Mail-Adresse dabei, um evtl. auch zu antworten!
Dort in Zeile ‚Formular‚ → ‚E-Mail-Feld unterhalb des Formulars anzeigen‘, dass angehakt ist.
… dann ist gleich das erste Häkchen in Zeile ‚E-Mails‚ → ‚Feedback per E-Mail erhalten‘ ein Muss:
Vorlage in etwa:
<p>Hallo!</p>
<p>Sie haben neues {type} Feedback für Ihren Beitrag erhalten.</p>
<p><strong>Post:</strong> <a href="{post_url}">{post_title}</a><br>
<strong>Name:</strong> {name}<br>
<strong>Email:</strong> {email}<br><br>
<strong>Mitteilung:</strong> {message}</p>
<p>Diese Nachricht wurde von {blog_url} gesendet.</p>
Zweitens, ebd. Zeile ‚E-Mails‘
Im Zweiten ist es sehr freundlich, wenn dem Besucher der Mitteilung eine Bestätigungsmail folgt.
Die abstimmende Person erhält die E-Mail mit dem Häkchen bei:
…für den ‚Inhalt der E-Mail‘ eine Vorlage:
<p>Hallo!</p> <p>Diese E-Mail liegt Ihnen vor, weil Sie eine Mitteilung zur {post_url} im Titel "{post_title}" gesendet. Damit sind das die Daten der Nachricht:</p> <p><strong>Name:</strong> {name}<br> <strong>Email:</strong> {email}</p> <p><strong>Mitteilung:</strong> {message}</p><br> <p>Vielen Dank für Ihr Feedback!</p> <p>Diese Nachricht ist von {blog_url}.</p>
Zeile ‚Labels‘
Als Anhang im Menü Feedback zur Zeile ‚Labels‘.
Bspw in Zeile ‚E-Mails‘ nach der Aktivierung zur Bestätigungsmail (Feedback per E-Mail erhalten). Da passt zum Label ‚E-Mail‘ so was wie, E-Mail … die Bestätigungsmail folgt
Am besten ist, der Einstellungen und Anpassungen sich mal freien, halben Tag gemütlich zu befassen.
[tabbylink tab=4 offset=100 fade=400]Tab 4: Dann noch kurz zum Menü System das mit den Cookies, indem ein Interview mit Kevin P.[/tabbylink]
[tabby title=“4″]
Menü System
Im Ersten, das unter System, dort findet sich das mit Cache und so. Das mit dem Cache will aber erst mal etwas erklärt sein. Das Tags dort heißt ‚Transients API‘ von WordPress.
Im Zweiten zur Frage, das der [Magic]-Cookies an sich und für sich das mit der DSGVO.
Kevin P. im Interview
…dabei ist hier scrolle
Das mit Cache und
‚Transients API‘ von WordPress
Herr Kevin! – bitte: Was ist die Transients API von WordPress?
Die Transients API von WordPress speichert bspw große Abfragen in der Datenbank ab. Wenn man jetzt bspw alle Beiträge auf einem Blog abruft, dann wird für jeden Beitrag ein Abruf in der Datenbank generiert.
Wenn man die Beiträge aber alle einmal abruft und dann in der Datenbank abspeichert. So muss man nur noch einmal das Ergebnis abrufen. Also wenn man 50 Beiträge hat und alle in einer Option speichert, dann hat man nur noch eine Abfrage anstelle von 50 Abfragen.
Inwiefern ist das im Feedback-Plug-in Helpful?
Helpful nutzt das dann bspw für das Dashboard Widget. Da werden die Voten nicht alle einzeln abgerufen, sondern einmal alle und dann gespeichert. Das verbessert die Ladezeit im Adminbereich. Jedes Mal, wenn jemand eine Stimme mit Helpful abgibt, wird der Cache bzw. der transient gelöscht und neu generiert.
Und nun! – wie ist das denn mit dem Cache?
Die Transient-API ist eine API von WordPress, mit der man Inhalte „cachen“ kann.
Wenn du viele Stimmen hast (+1000), dann kann dir der Cache helfen. Bis dahin ist das aber nicht wichtig. Womöglich ist dein Server bzw. deine Datenbank auch so schnell, dass du erst nach +100.000 Stimmen einen Cache benötigst. Du machst auf jeden Fall nichts falsch, wenn du die Option aktivierst. Du wirst nur bei wenig Stimmen keinen Unterschied merken. Also ob aktiviert oder nicht.
… noch ein kurzes Schlusswort zum Thema?
Das schöne an der Transient API ist, dass sie von Haus aus in WordPress integriert ist. Schade ist: So manch Entwickler von Plug-ins wissen das nicht…
Da ich ja WordPress-Entwickler bin, muss ich die Funktionen von WordPress kennen. Deshalb nutze ich auch immer gern die Dinge von WordPress, bevor ich eigene Dinge baue oder auf Externes greife. Bspw sind das auch die Diagramme und Tabellen innerhalb von Plug-in Helpful.
Vielen Dank! – das Interview hat sehr geholfen.
Und nun Fragen zum Cookie mit Helpful
Wie funktioniert so Cookie, wie hier auf Helpful ist?
Das Cookie wird mit init* gesetzt, also es wird sofort für die ganze Domain gesetzt. Das kann auch im wp-admin sein. WordPress selbst hat nur 2-3 add_action´s (Hooks) die irgendwie nützlich sind. Leider wird nur eine davon ausschließlich im wp-admin verwendet. Alle anderen werden überall verwendet, weshalb ich das nicht eingegrenzt habe. War mir auch nicht so wichtig, ehrlich gesagt. Also man hat keinen Nachteil dadurch, dass es im wp-admin gesetzt wird.
https://developer.wordpress.org/reference/hooks/init/
Herr Kevin aber, dass das Cookie helpful_user (Funktionell) schon auf der „Seite zum Einloggen Dashboard“ neben dem Cookie PHPSESSID (Funktionell) mit dabei ist – hingegen funktionierte nicht auch das Cookie erst mit der Abstimmung zu generieren?
Folgendes wurde mit Update 4.4.55 teils geändert. Also Helpful setzt das Cookie und die Session nur noch im Frontend, nicht mehr im Login- oder Admin-Bereich.
Das funktionierte nicht, da ich ja schon vor der Abstimmung wissen muss, ob der Nutzer abgestimmt hat. Wenn ich das Cookie immer erst setze, wenn der Nutzer abstimmt, weiß ich ja nicht, ob er nicht schon bereits abgestimmt hat.
Äh ja, sehr einleuchtend. Danke. Und wie läuft das Cookie so zur DSGVO?
Im Forum wurde gefragt, ob das Cookie irgendwie gegen die DSGVO verstößt. Siehe https://wordpress.org/support/topic/helpful_user-cookies-prior-consent/. Das tut es aber nicht, weil keine personenrelevanten Daten gespeichert werden. Also es wird nicht einmal die IP gespeichert (was es mir auch superschwer gemacht hat, das Plugin zu bauen, aber es hat geklappt).
Helpful erstellt einen einzigartigen zufälligen Text in dem keine Nutzerdaten gespeichert sind. Das ist einfach irgendein zufälliger Text. Man kann herausfinden, dass Abstimmungen mit Helpful von einem Text durchgeführt wurden, aber es ist nicht herauszufinden, wer hinter diesem Text versteckt ist. Einfach weil das ein zufällig zusammen gewürfelter Text ist.
Ein Beispiel: f53ebcd747deaa6d0724b2da51488466 so ist gerne einmal zu versuchen, um herauszufinden, wer das ist (Browser, Zeitpunkt, Standort, usw.). 🙂
Ja! – sehr erklärlich alles. Dankeschön. – und für die Leser Wegerl-WP bleibt da auch noch ein Schlusswort?!
Mein Ziel war es auch, dass es einfach läuft. Also ohne sich Gedanken darüber machen zu müssen, ob irgendwelche Rechte verletzt werden. Das ist auch der Grund, warum andere Plug-ins supertolle Statistiken mitliefern, weil sie nicht DSGVO-konform sind. Helpful hat das nicht.
Vielen Dank für das Interview!
– wie immer sehr von Erfolg das.
[tabbylink tab=5 offset=100 fade=400 class=tabbylinkclass]Tab 5: Zum individuell: Menü Design / CSS wie hier zum Beispiel.[/tabbylink]
[tabby title=“5″]
Menü Design
Neben der Vorlage ‚Blank‘ für den CSS-Kreativen, sind sechs Theme da. Dies alles ist über den Customizer, s. dort ‚Helpful‘.
…so bspw von CSS
Im Customizer / Helpful > Design → Benutzerdefiniertes CSS.
Helpful ist hier das Theme ‚Base‘. So mehr kleine Änderungen des Themes:
/* == Helpful Änderung Anfang == */
/* Formularabstand. Oben u. unten */
.helpful {margin: 80px 0;
}
/* Überschrift. Schriftgröße */
.helpful > .helpful-header > .helpful-headline {
color: #333;
font-size: 140%;
}
/* Buttons. Schriftgröße u. Druckschrift */
.helpful > .helpful-controls > div > .helpful-button {
font-size: 1em;
text-transform: none;
text-align: center;
line-height: 120%;
min-height: 3.5em;
padding: 0px;
display: table-cell;
vertical-align: middle;
}
/* Button 'Nein'. Balken Farbe u. Breite */
.helpful > .helpful-controls > div > .helpful-button[data-value="contra"] {
border-left: 2px solid #FFCC00;
}
/* Formular zur Nachricht. Button, Druckschrift u. Innenabstand */
.helpful > .helpful-content > .helpful-feedback-form > .helpful-button {
text-transform: none;
padding: 4px 15px;
}
/* Dunkel-Modus: Mouseover Button Schrift sichtbar */
.helpful>.helpful-controls>div>.helpful-button:hover {color: rgb(193, 187, 175) !important;}
/* Dunkel-Modus: Feedback Label Schrift sichtbar */
.helpful .group label {
color: rgb(193, 187, 175) !important;
}
/* Helpful Änderung Ende */
Des Letztren das mit Dunkel-Modus geht im Zusammenspiel mit Plug-in WP Dark Mode hervor:
Obiges linkes Bild, das mit der Auszeichnung <b> wird aber so meist nicht funktionieren und eben dazu ist das CSS der Etiketten für den Dunkel-Modus von nutzen.
[tabbylink tab=6 offset=100 fade=400]Tab 6: FAQ, das Ankerziel zum Feedback-Formular von den Meta aus.[/tabbylink]
[tabby title=“6″]
FAQ
Anker zum Feedback Plug-in Helpful
Für den Besucher ist es sehr schick und konform bei den Meta einen Link zum Feedback-Helpful. Sei es neben wie SCHREIBE EINEN KOMMENTAR oder auch stattdessen. Siehe hier:
Hierzu ist nun vom Autor des Plug-ins die Programmierung bereitgestellt. Auf GitHub im Titel:
Hilfreiches Plugin: Anker zum Formular
Also dieser Code ist erst mal in die functions.php einzufügen. Wobei ich da den Code von unterhalb empfehle: „Ohne ID des Beitrags“. Von dort den Inhalt in die functions.php einfügen.“
[codesnippets]
Dies läuft dann auch mit dem Shortcode [[helpful_anchor]]. Der Website direkt wie mit Shortcode ist das am Besten im Widgetbereich einzubringen.
… Der Anker im Text Widget
Den Shortcode in das ‚Text‘ Widget einfügen.
- Das ist für manch Theme wie Twenty Seventeen so das…
- Den Shortcode bspw so:
<span style="font-size: 18px; text-align: center; box-shadow: 10px 20px 30px grey; background: linear-gradient(to right, #C9FFDF, #ffffff); margin: 0 -5px;">[helpful_anchor]</span>. - Das andere mit dem Icon von Helpful, das ist da gleich weiter unten.
Anders, den Shortcode jeweilig dem Beitrag einfügen. Diese Gangart ist nicht so zu empfehlen. Hingegen ist sehr elegante…
Im Theme platzieren
Vielmehr ist es, wie oben schon hervorgehoben, die Verlinkung zum Feedback-Formular von den Meta aus.
Dazu ist dann der Code <?php echo do_shortcode( '[[helpful_anchor]]' ); ?>.
Mit diesem Code ist das im Theme einzufügen. Und im Netz heißt das dann gern, „irgendwo in deinem Theme“ 🙂 Hier nur kleines bspw für die Meta im Theme Twenty Fourteen. Das ist dann für die content.php mit diesem Code:
<span class="entry-meta"> <?php echo do_shortcode( '[[helpful_anchor]]' ); ?> </span>
Also für Theme Twenty Fourteen. wordpress / wp-content / themes / twentyfourteen / content.php.
Nun des Moments: Nach einem Theme Update ist dort der Code evtl. zu erneuern.
- Demnach ist das für uns als Merkzettel zum nächst Theme Update. Das mit dem Code ist dann ja fix.
Piktogramm von Helpful zum FEEDBACK 
Das Beispiel hier ist ein PNG 2 KB. Also das Icon da mit Rechtsklick auf den Comp. downloaden. So bleibt, nach dem Download das ‚helpful-heart.png‘ in die WP-Mediathek zu laden.
Das Icon ist dann im WP-Editor zu öffnen, um die Größe und die Margins einzurichten. … hier das PNG Icon schattiert. Das hat 9 KB.
FEEDBACK
Das Icon positionieren
- Vergewissere dich, dass die Ausrichtung auf ‚Keine‘ steht.
- Die Größe, die passt
- und die Margins einrichten.
Und wie sind die ‚margins‘ komfortabel einzurichten? Da weise ich das Plug-in Advanced Image Styles.
Von dort im Editor Text-Modus ist der Code vom Icon dann zu kopieren und in das Snippet in die functions.php des Themes zu editieren.
functions.php des Themes:
Dasselbe:
/**
* Fügt einen neuen Shortcode [[helpful_anchor]] hinzu.
*
* @return string
*/
add_shortcode( 'helpful_anchor', function() {
global $post;
$id = 'helpful-' . $post->ID;
$permalink = get_the_permalink( $post ) . '#' . $id;
return sprintf( '<a href="%s">%s</a>', $permalink, 'Feedback<img class="alignnone wp-image-188852" style="margin: -30px 0 0 0px;" role="img" src="https://..helpful-heart.png" alt="helpful-heart" width="27" height="25" />' ); // Hier ggf. den Text anpassen
});
Nächst ists dann mit dem folgendem PNG Bild 3 KB. Das ist wie oben, also Ausrichtung ‚keine‘ und die Größe passend usw. Evtl. mit ‚margin‘ noch ausrichten.
FEEDBACK 
Und weil’s grad zur Hand ist … Das folgende Piktogramm ist ein SVG. Also dieser Spielart muss in WP der SVG Upload gegeben sein. Wenn denn, dann siehe doch erst zum Beitrag Vektorgrafik SVG kennenlernen.
Nächst das SVG ist hier gleich zum Download ZIP helpful-heart.svg*. Das hat nur 1 KB 🙂 Aber sei viel lieber sehr vorsichtig mit so Download von SVG. Daher kannst du das Piktogramm genauso gut direkt aus Helpful öffnen, s. Dashboard → Helpful → Einstellungen, oben Mitte. Nach dem Download auf den Comp. ist das helpful-heart.svg in die WP-Mediathek zu laden usw.
* Der SVG Check ergab: Keine Probleme gefunden.
Scroll zum Anker
Statt zum Anker springen das im scrolle. Das nun ist JavaScript und im Childs Theme der scripts.js.
/* Scroll zum Anker */
(function($) {
// Alle Fehlermeldungen zeigen, um Fehler zu beheben.
"use strict";
function zumAnkerScrollen() {
let anker = ["#helpful", "#ih"];
$.each(anker, function(index, value) {
$("a[href=\"" + value + "\"]").on("click", function(e) {
e.preventDefault(); // Deaktiviert die generelle Funktion des angeklickten Links
var offset = -70; // wie viel Platz oberhalb sein soll, also die Höhe der Kopfzeile.
if ($(value).length) {
$('html, body').animate({
scrollTop: $(value).offset().top + offset
}, 500); // Die Geschwindigkeit für die Animation. Hier ist halbe Sekunde.
}
});
});
}
// Alternative für $(document).ready({});
$(function() {
zumAnkerScrollen();
});
})(jQuery);[kevin.p]
Oben bei let anker = ["#helpful", "#ih"] sind hier schon zwei Scrollmodus definiert. Das "#helpful" versteht sich so und "#ih" ist da wie unterhalb Tabmenü das Herz im anklicke zum Inhaltsverzeichnis scrollt. Siehe auch evtl. zum Beitrag Mein Button.
So sind auch weitere Einträge einfügbar. Bspw:
let anker = ["#helpful", "#ih", "#id2", "#id3", "#id3"];
Browser und der gestrichelte Rand um den Button
Browser zeigen mitunter nach anklicke des Buttons gestrichelten Rand um den Button. Der Rand ist mit CSS aufzulösen. Hier wieder das für "#helpful" und "#ih" das Beispiel aus dem Beitrag Mein Button.
/* Rand um Button auflösen */
a[href^="#helpful"]:focus, a[href^="#ih"]:focus {
outline: none !important;
}
[tabbylink tab=7 offset=100 fade=400 ]Im nächst Tab ein ‚Individuelles Feld‘ im Feedback-Plug-in Helpful‘.[/tabbylink]
[tabby title=“7″]
FAQ
Individuelles Feld*
im Feedback-Plug-in Helpful
* Oder so im Namen ‚Benutzerdefinierte Felder‘. Das ist hier mit Classic-Editor.
Im Classic-Editor ganz oben über ‚Ansicht anpassen‘ sind die ‚Benutzerdefinierte Felder‘ mit dem Häkchen zu aktivieren. Im Block-Editor im Namen ‚Individuelle Felder‘. Diese sind ganz rechts oben über ‚Ansicht anpassen‘, ganz unten ‚Voreinstellungen‘ f. anzuhaken. So sind dann im Bereich unter dem Editor die Felder zu nutzen.
Es geht hier um ein ‚Individuelles Feld‘, das im Feedback-Plug-in Helpful seinen Platz finden soll. Das ist sehr gefällig, bspw da der Hinweis zum ‚Schreibe einen Kommentar‘. Der Hinweis ist dann nämlich nur so anzuzeigen, wenn dem Beitrag auch der direkte Kommentar bzw. Discus erwünscht ist. Wie ist das wohl am besten in Helpful eingebracht?
‚Individuelles Feld‘ anlegen
Erst hilft mal ein ‚Individuelles Feld‘ anzulegen. Das ist jedem Beitrag unterhalb im Boxbereich. Da bei ‚Name‘ ist auf die Groß- und Kleinschreibung zu achten. … Und so ist das je nach Beitrag individuell anzulegen und auszugeben.
Nun als Vorlage unter Wert dasselbe wie obig, aber da mit einem Rahmen:
<p style="border: 2px solid #8EC663; margin: -12px 0 -5px 15px; width: 420px; padding: 8px 0 8px 9px;">Und so als Kommentar? – <a href="#respond">klick an zum … ↓</a></p>
Hinweis im Titel In WordPress benutzerdefinierte Felder anlegen und ausgeben.
‚Individuelles Feld‘ realisieren
Folglich des ‚Individuelles Feld‘ im Editor, so ist das auch zu programmieren.
- Dashboard / Plugins / Editor > Helpful in templates / helpful.php zu editieren, ganz unten nach
</div><!-- .helpful -->
templates / helpful.php:
</div><!-- .helpful -->
<?php
global $wp_query;
$postid = $wp_query->post->ID;
echo '<div class="hinweis">';
echo get_post_meta($postid, 'hinweis', true);
echo '</div>';
wp_reset_query();
?>
- Tja, so ist das dann nach einem Plug-in Update auch wieder herzustellen.
Soweit dem Beitrag das ‚Individuelle Feld‘ im Editor eingegeben wurde ist das visuell:
… und zwar den Feldern von nächst anklicke. Jedoch nicht der Option, dass zur Wiederkehr das E-Mail-Formular wieder da ist. Also nicht dem Feld im Zusammenhang von Menü Feedback der Zeile ‚Bereits abgestimmt‘. Also dann:
- Dashboard / Plugins / Editor > Helpful in templates / feedback.php dort ganz unten gleich im Anschluss ist derselbe Code wie oben zu editieren.
… Nun ist das ‚Individuelle Feld‘ überall zu sehen. Ob mit dem Letztren das in der templates / feedback.php dann rudimentär* wirkt? – so ist das allein in der templates / helpful.php sehr gut . … 🙂
Des bspw den Text unter Helpful stets anzeigen
Da geht der HTML-Code in die PHP-Datei. Gleich wie oben statt des PHP-Codes für das ‚Individuelle Feld‘.
templates / helpful.php:
</div><!-- .helpful -->
<p style="border: 2px solid #8EC663; margin: -12px 0 -5px 15px; width: 420px; padding: 8px 0 8px 9px;">Und so als Kommentar? – <a href="#respond">klick an zum … ↓</a></p>
- Tja, so ist das dann nach einem Plug-in Update auch wieder herzustellen.
… Oder bspw hier die Credits zu helpful-plugin.info (Bereitgestellt von Helpful) der gleichen Zeile mit float: left; und den Text ‚Mein fix zum Feedback-Plug-in Helpful‘.
templates / helpful.php:
</div><!-- .helpful-footer --> <span style="float: left; font-size: 11px; margin-left: -40px;"><a style="text-decoration: none; color: #808080;" href="https://wegerl.at/feedback-plugin-helpful/">Mein fix zum Feedback-Plug-in Helpful</a></span> <?php endif; ?> </div><!-- .helpful -->
… oder auch mit so Dekoration?
Die Dekoration
– gleich da neben dem Helpful-Formular der „Roboti“. Das ist dann auch im ‚Individuelles Feld‘ einzugeben. … Oder so in den Helpful Einstellungen für Texte und Feedback. Des Letzten ist komfortabler.
Das Beispiel hier des „Roboti“ siehe dann zum Beitrag https://simpel.wegerl.at/zwei-bilder-ineinanderfuegen/.
Das mit ‚Individuelles Feld‘ und hier dem Roboti,
mal so pro forma
Das HTML ist im ‚Individuelles Feld‘ einzugeben. Der Code für den ‚Wert‘ dann:
Oder so als Kommentar? – <a href="#respond">klick an zum … ↓</a>
<div class="image-mouseover" style="margin: -230px 0 0 -85px;">
<img class="before alignleft" src="https://../wegerl-roboti2.svg" alt="roboti" width="110" height="auto" />
<img class="after alignleft" src="https://../wegerl-roboti-maske.svg" alt="roboti" width="110" height="auto" /></div>
Aber das mit den ‚Individuelles Feld‘ ist so im Nachhinein nicht geeignet, da WP hierzu keine ‚Mehrfachaktion‘ vorgesehen hat. So bleibt für das direkt in Helpful / Einstellungen und das ist ohnehin praktischer. Sofern das Bild auch immer dabei sein darf.
Nun infolge ist das in Helpful einzutragen:
Helpful / Einstellungen dort unter Menü Text und Menü Feedback
Wenn – dann ist da und dort einzutragen, und zwar:
- In Menü Texte, Zeile ‚Vor der Abstimmung‘
→ Inhalt. - In Menü Texte, Zeile ‚Nach der Abstimmung‘
→ Bereits abgestimmt.
Wenn im Menü Feedback in der Zeile ‚Bereits abgestimmt‘, das angehakt, so ist stattdessen dort einzutragen.
→ Nach der Abstimmung (Pro)
→ Nach der Abstimmung (Kontra)
Weiter, wenn – dann ist da und dort einzutragen, und zwar:
- In Menü Feedback, ‚Zeile Nachrichten‘
→ Nachricht (Pro).
→ Nachricht (Kontra). - In Menü Feedback, Zeile ‚Bereits abgestimmt‘, sofern da angehakt ist.
→ Nachricht (Bereits abgestimmt).
Der Eintrag bspw:
<div class="image-mouseover" style="margin: -3px 0 0 -95px;">
<img class="before alignleft" src="https://../wegerl-roboti2.svg" alt="roboti" width="110" height="auto" />
<img class="after alignleft" src="https://../wegerl-roboti-maske.svg" alt="roboti" width="110" height="auto" /></div>{author} heißt Dich Willkomm!
<p style="text-align: center;">… und dann gern Dein Sagen <br/>auch kleine Frage.</p>
[tabbylink tab=8 offset=100 fade=400 ]…und im nächst Tab geht es um die Reihung von Feedback-Plug-in Helpful.[/tabbylink]
[tabby title=“8″]
FAQ
Reihung von Feedback-Plug-in Helpful
Der Reihung von Plug-in ‚Helpful‘ und hier Plug-in ‚Wordpress Related Posts‘ ergehen die ‚Related Posts‘ über das ‚Helpful‘.
Das mit Plug-in ‚Wordpress Related Posts‘ ist
von gestern und nur mehr so als Fallbeispiel
von wegen Reihenfolge.
Insofern stellt sich das ‚Feedback Helpful‘ unter die ‚Related Posts‘. Da mag es Geschmacksache sein, die Reihung umzudrehen. Dies geht nicht aus dem Core des Plug-ins ‚Helpful‘ hervor. Darum ist hier der Code für die functions.php gist.github.com/pixelbart/*.
Dazu ist dann noch in den Einstellungen des Plug-ins ‚Wordpress Related Posts‘ unter Advanced settings → Other Settings bei ‚Auto Insert Related Posts‚ das Häkchen zu entfernen.
* Für ein anderes Related-Post-Plug-in lässt sich der Code auch anpassen. Sofern des Plug-ins dies sich in den Einstellungen, wie in ‚Wordpress Related Posts‘, zu arrangieren ist.
[tabbyending]
[myHelpful]
Das Herz spricht für das Plug-in! –
so klasse, sehr performant und gut gewartet.