ANLEITUNG: Bookmarks am rechten Bildschirmrand

[albersmann]

Anleitung: Bookmarks am rechten Rand einblenden
Originalmodul von MaXiForum.cz für SMF SimpleMachines

"/templates/deintemplate/index.html":

Am Ende einfügen:

Code: PHP  [Auswählen]

<a id="sys_contact" target="_self" href="{php}echo xtc_href_link(FILENAME_CONTENT, 'coID=7', 'NONSSL');{/php}" title="Kontakt"> </a>
<a id="sys_twitter" target="_blank" href="_hier_dein_Link_" title="Twitter"> </a>
<a id="sys_facebook" target="_blank" href="_hier_dein_Link_" title="Facebook"> </a>
<a id="sys_xing" target="_blank" href="_hier_dein_Link_" title="Xing"> </a>
<a id="sys_linkedin" target="_blank" href="_hier_dein_Link_" title="LinkedIn"> </a>
<a id="sys_googleplus" target="_blank" href="_hier_dein_Link_" title="Google+"> </a>
<a id="sys_rss" target="_blank" href="http://www.deinshop.de/rss_news.php" title="RSS"> </a>
<a id="sys_pinterest" target="_blank" href="_hier_dein_Link_" title="Pinterest"> </a>
<a id="sys_youtube" target="_blank" href="_hier_dein_Link_" title="Youtube"> </a>

Solltet ihr die ID für das Kontaktformular bei euch geändert haben, müsst ihr hier die „7“ durch eure neue ID ersetzen. Bei Erstinstallation ist es aber immer die ID=7.

"/templates/deintemplate/stylesheet.css":

Am Ende einfügen:

Code: CSS  [Auswählen]

/* Begin Show your social networks thanks to MaXiForum.cz for the idea and the new code*/

#sys_contact {
  display:scroll;
  position:fixed;
  top:150px;right:0px;
  background-image: url(/images/sys/contact.png);
  background-position: 0px 0px;
  width: 40px;
  height: 40px;
  text-decoration: none;
}

#sys_twitter {
  display:scroll;
  position:fixed;
  top:200px;right:0px;
  background-image: url(/images/sys/twitter1.png); /* Alternativ mann such das Bild twitter2.png benutzt werden */
  background-position: 0px 0px;
  width: 40px;
  height: 40px;
  text-decoration: none;
}

#sys_facebook {
  display:scroll;
  position:fixed;
  top:250px;right:0px;
  background-image: url(/images/sys/facebook.png);
  background-position: 0px 0px;
  width: 40px;
  height: 40px;
  text-decoration: none;
}

#sys_xing {
  display:scroll;
  position:fixed;
  top:300px;right:0px;
  background-image: url(/images/sys/xing.png);
  background-position: 0px 0px;
  width: 40px;
  height: 40px;
  text-decoration: none;
}

#sys_linkedin {
  display:scroll;
  position:fixed;
  top:350px;right:0px;
  background-image: url(/images/sys/linkedin.png);
  background-position: 0px 0px;
  width: 40px;
  height: 40px;
  text-decoration: none;
}

#sys_googleplus {
  display:scroll;
  position:fixed;
  top:400px;right:0px;
  background-image: url(/images/sys/googleplus.png);
  background-position: 0px 0px;
  width: 40px;
  height: 40px;
  text-decoration: none;
}

#sys_rss {
  display:scroll;
  position:fixed;
  top:450px;right:0px;
  background-image: url(/images/sys/rss.png);
  background-position: 0px 0px;
  width: 40px;
  height: 40px;
  text-decoration: none;
}

#sys_pinterest {
  display:scroll;
  position:fixed;
  top:500px;right:0px;
  background-image: url(/images/sys/pinterest.png);
  background-position: 0px 0px;
  width: 40px;
  height: 40px;
  text-decoration: none;
}

#sys_youtube {
  display:scroll;
  position:fixed;
  top:550px;right:0px;
  background-image: url(/images/sys/youtube.png);
  background-position: 0px 0px;
  width: 40px;
  height: 40px;
  text-decoration: none;
}

#sys_contact:hover, #sys_twitter:hover, #sys_rss:hover, #sys_facebook:hover, #sys_googleplus:hover, #sys_xing:hover, #sys_linkedin:hover, #sys_pinterest:hover, #sys_youtube:hover {
  background-position: 0px 39px;
}

/* End Show your social networks */

Der Ordner /sys enthält die Grafiken. Diesen bitte in den Ordner Images im Shoproot kopieren (root/images/sys).

Werden die Bilder nicht angezeigt, dann ändert den Background Pfad mal wie folgt:

Code: CSS  [Auswählen]

  ...
  background-image: url(../images/sys/contact.png);
  ...

oder:

Code: CSS  [Auswählen]

  ...
  background-image: url(../../images/sys/contact.png);
  ...

Wer mag kann die Icons (Ordner /sys) auch ins /img Verzeichnis im Templateordner kopieren. Dann muss der Pfad in der css wie folgt aussehen:

Code: CSS  [Auswählen]

  background-image: url(img/sys/facebook.png);

Viel Spaß damit Gruß
Sven

[ Für Gäste sind keine Dateianhänge sichtbar ]

[EDIT Tomcraft 16.07.2011: Fehler in Anleitung korrigiert, Danke an franky_n für den Hinweis.]
[EDIT Tomcraft 07.09.2011: Fehler korrigiert, Danke an Jim für den Hinweis.]
[EDIT Tomcraft 23.09.2011: Fehlerhafte Dateiendung in der Anleitung des Moduls korrigiert, Danke an Dee01 für den Hinweis.]
[EDIT Tomcraft 12.07.2012: Anleitung um Xing, LinkedIn und Google+ erweitert, Danke an jannemann für die Google+ Grafik.]
[EDIT Tomcraft 23.01.2013: Fehler in Anleitung korrigiert.]
[EDIT jannemann 26.01.2013: YouTube und Google+ Button hinzugefügt]
[EDIT Tomcraft 16.05.2013: Modul erweitert um Pinterest, Youtube und alternatives Bild für Twitter.]

Linkback: https://www.modified-shop.org/forum/index.php?topic=13847.0

[Tomcraft]

Du bist ja der Knaller, dass du das der Community gleich zur Verfügung stellst!

Danke Sven!

Ich habe mir mal noch erlaubt das "shop_content.php" im Link gegen "FILENAME_CONTENT" zu tauschen.

Grüße

Torsten

[super-nailcenter.at]

Super, dafür möchte ich mich auch recht herzlich bedanken!

[jannemann]

Hi,

vielen Dank für diese tolle Erweiterung. Allerdings habe ich irgendwie ein Problem mit der Verlinkung zu meinem Kontaktformular. Wenn ich den Code so in die index.html schreibe und dann auf den Button für das Kontaktformular drücke, erscheint folgende URL:

Code: PHP  [Auswählen]

http://www.meine-domain.de/FILENAME_CONTENT?coID=7

Kann es daran liegen, dass mein Shop im Ordner "shop" liegt?

Dann ist mir aufgefallen, dass der rss-feed nicht mehr geht, bzw. die Seite komisch angezeigt wird. Ich habe das Modul hier aus dem Forum ("MODUL: RSS-Feed für modified eCommerce Shopsoftware (deutsch & englisch"). Ist das noch keinem aufgefallen, dass dieses Modul nicht mehr funktioniert?

[albersmann]

Füge folgenden Code ein:

Code: PHP  [Auswählen]

<a id="sys_contact" target="_self" href="{php}echo xtc_href_link('FILENAME_CONTENT', 'coID=7', 'NONSSL'){/php}" title="Kontakt"> </a>

Ohne den http Link. Dann sollte es gehen.

Gruß

Sven

[Tomcraft]

[...]

Code: PHP  [Auswählen]

http://www.meine-domain.de/FILENAME_CONTENT?coID=7

[...]

Ich hatte das doch bereits in der Anleitung korrigiert, wo hast de denn diese falsche Verlinkung noch her?

Grüße

Torsten

[jannemann]

Hi,

sorry, irgendwie war noch das falsche in der Zwischenablage. Wenn ich diesen Code so einbaue, dann sieht mein Link nach dem Klick auf den Kontaktbutton so aus:

http://www.mein-shop.de/shop/FILENAME_CONTENT?coID=7
Als Fehlermeldung zeigt der Browser:

Code: PHP  [Auswählen]

The requested URL /shop/FILENAME_CONTENT was not found on this server.

[franky_n]

Hallo jannemann,

mach mal bei FILENAME_CONTENT davor und dahinter die Hochkommata (') weg...

Viele Grüße

Franky

[EDIT Tomcraft 16.07.2011: Korrektur in Anleitung aus Beitrag 1 eingefügt.]

[jannemann]

Hallo Franky,

vielen Dank für deinen tollen Tipp!! Klappt jetzt.
Hat jemand noch einen Tipp für das Problem mit dem RSS-Feed?

Schöne Grüße,
Jens

[Tobi74]

Hallo,
wie soll denn so ein Facebook bzw. Twitter Link genau aussehen?

Viele Grüße
Tobias

[jannemann]

Hallo Tobias,

wenn du einen Account bei Twitter hast, dann verlinkst du den Button einfach auf deine Seite. Mal ein Beispiel für die Twitterseite von Tomcraft:

Code: [Auswählen]

http://twitter.com/#!/modified eCommerce Shopsoftware
Bei Facebook ist es gleich. Du verlinkst einfach auf deine Fanpage.

Schöne Grüße,
Jan

[jannemann]

Guten Morgen,

vielleicht kann ja der ein oder andere noch das Icon für Wordpress gebrauchen.

Schöne Grüße,
Jan

  [ Für Gäste sind keine Dateianhänge sichtbar ]

[Tomcraft]

Dankeschön für's Teilen!

Grüße

Torsten

[Juli1898]

Hallo, vielen Dank für den super Code. Funktioniert prima im Mozilla, aber...
Bei mir werden die Buttons im Internet Explorer links unten angezeigt und nicht am Rand rechts, wie eigentlich gewünscht. Kann jemand helfen?

Danke

[jannemann]

Hallo Juli1898,

mit welcher IE Version hast du denn das Problem?
Ich kann es nämlich mit dem IE8 nicht nachvollziehen. Hast du mal den Browsercache geleert?
Sonst poste mal deine index.html.

Schöne Grüße,
Jan