Betterplace Overlay-Spendenbutton

Betterplace bietet einen Overlay-Spendenbutton für die eigene Webseite an.

Damit der Button auf jeder Seite angezeigt wird, bietet es sich an, die Aktion an den “wp_body_open”-Hook zu binden. Das von Betterplace bereitgestellte JavaScript-Snippet wird so im Fußbereich der Seite geladen.

add_action('wp_body_open', 'this_after_body');
function this_after_body() {
	print '<script async="async" type="text/javascript" src="https://www.betterplace.org/de/widgets/overlays/DAU3hB3UzkY7mHsryBAcSMPB.js"></script>' . "\n";
}

Das Ergebnis sieht dann wie folgt aus:

Der Spendenbutton überlagert u.U. den “Nach-oben” (Scroll-To-Top)-Button. Abhilfe könnte dabei ein CSS-Schnipsel schaffen:

.bp-overlay-button {
    background-color: red !important;
    color: white !important;
    bottom: 75px !important;
}

Die !important-Notationen sind erforderlich, damit die inline-CSS-Angaben überschrieben werden. Das Ergebnis sieht dann wie folgt aus: