Design Clean
    >> Tipps zum anpassen

Facebook Messenger

Facebook Messenger einbinden

Messenger

Jeder Besucher kann Dir Sofort-Nachrichten von der Homepage aus über den Facebook-Messenger senden. Egal ob Desktop-Nutzer oder mobiler Nutzer. Einzige Vorraussetzung : Der Homepage-Besucher muss einen Faceboo-Account besitzen. Der Code ist sehr einfach.

HTML-Code für Seiteninhalt oder rechte Box

Für verlinkten Text :

<a href="https://m.me/Facebookname"> Hier Text </a>
oder HTML-Code für Grafik verlinken :

<a href="https://m.me/Facebookname"> <img src="Grafikadresse" alt="Bild" /></a>
Im HTML-Code Facebookname und Grafikadresse einfügen.
Wo finde ich Facebookname ? Wie finde ich die Grafikadresse ?.


In der Navigation / Menü einfügen

- Einloggen in Homepage
- auf "Seiten" und "neue Seite erstellen"
- neben dem Titelfeld auf das Zahnrad-Symbol
- fahre mit der Maus auf "Normale Seite" und wähle "externer Link"
- nun wird Zusatzfeld sichtbar :"Auf was soll verlinkt werden"
- hier fügst Du folgenden Link ein :
https://m.me/Facebookname
Ersetze das Wort Facebookname durch deinen Facebook-Namen,


Eigenen Button gestalten

Mit reinem HTML-Code fügen wir uns einen verlinkten Button ein. Im HTML-Code ersetze Facebookname durch deinen Facebook-Namen. Und füge gewünschte Grafikadresse ein. Es wird automatisch ein rundes Bild. Bei HIER NAME schreibe gewünschten Namen hinein, der im Button stehen soll. Einfügen im Seiteninhalt - oder - im Feld "rechte Box".

messengerClean-Test.de.tl
im Messenger aktiv

<p class="messenger">
<a href="https://m.me/Facebookname">
<img src="Grafikadresse" alt="Bild"> <span class="zeile1"> HIER NAME </span>
<br>
<span class="zeile2"> im Messenger aktiv </span> </a>
<img class="logo" src="//img.webme.com/pic/c/clean-test/messenger.PNG">
</p>
Es folgt der CSS-Code :
<style type="text/css">

p.messenger { 
width:200px; border:1px solid #ccc; overflow:hidden; padding:10px; border-radius:15px; margin:auto; }

p.messenger img { width:60px; border-radius:80px; float:left; margin-right:20px; }
p.messenger a { text-decoration:none; }
a .zeile1 { font-weight:bold; font-size:15px; color:#999; }
a .zeile2 { font-size:11px; } 

.logo {
position:absolute; width:25px!important; margin-top:6px; padding:2px; background:#fff; margin-left:-130px; }

</style>

Den CSS-Code einfügen im Feld "Eigener <head> - Inhalt"

- dazu auf "Extras" gehen
- dort das Extra "Eigener <head> - Inhalt" öffnen

- falls dort schon CSS-Codes stehen, hier die style-tags weglassen
- also diesen Code ohne <style type="text/css">
- und ohne </style> am Ende
- in Euren bestehenden mit einfügen, vor eurem --> </style>


Weitere Möglichkeiten

In Gästebüchern und Kommentarfeldern könnt Ihr statt der Homepage-Adresse auch diesen Facebook-Link einfügen. Besucher, die auf den Link klicken, können Euch sofort im Facebook-Messenger anschreiben.
https://m.me/Facebookname
Ersetze das Wort Facebookname durch deinen Facebook-Namen




Kommentare zu dieser Seite:
Kommentar von Mirko Treichel( ), 27.09.2016 um 10:25 (UTC):
Hallo Wolle, danke für die Rückmeldung! Hat auf Anhieb geklappt. Daumen hoch!!

Kommentar von clean-test.de.tl( ), 27.09.2016 um 09:38 (UTC):
Hallo Mirko,
ja das ist möglich.
Im CSS-Code das p.messenger {
dem gibst du dazu: margin:auto;
margin ist Außenabstand. Und auto = setzt es mittig.

Kommentar von Mirko Treichel( ), 25.08.2016 um 11:59 (UTC):
Auch dieses ist wieder eine tolle Idee, wie so vieles hier. Kann man die erzeugte Grafik auch mittig der Seite bekommen? Will mir leider nicht gelingen. Eine eigene erzeugte und mittig gestellte Grafik mit dem o.g. HTML-Code läßt zumindest bei mir den Messenger nicht öffnen, in Gegensatz zu der "großen" Lösung, wo der Messenger einsetzt.

Kommentar von find-templates.de.tl( ), 10.07.2016 um 18:11 (UTC):
lässt sich auch wunderbar im Gästebuch umsetzen. Mit dem Zusatzfeld im Gästebuch und der Variable [input] könnte jeder Eintrag mit dem Zusatz "FB-Messenger" ausgestattet werden



Kommentar zu dieser Seite hinzufügen:
Dein Name:
Deine E-Mail-Adresse:
Deine Homepage:
Deine Nachricht:

Hier wurde die Seite https://clean-test.de.tl/nix.htm eingebunden.

- die Seite wurde in der Navi versteckt
- nur auf der Seite wurden alle div + table entfernt
- im Feld "Text UNTER Design" wurde dieser Inhalt eingefügt
- Inhalt wurde nur für diese eine Seite sichtbar gemacht
- so lässt sich auch eine Seite in der Mediabox aufrufen

Man muss darauf achten, das die Seite hier nur soviel Inhalt bekommt, wie diese Box auch an Höhe hat.

Wer mehr Infos dazu benötigt: Kontakt
clean-test.de.tl: Heute :19 Aufrufe



Auf "autostart" habe ich verzichtet. Klicke Play im Player.

nach Oben