dodanie facebook wysuwanego po najechaniu myszką widgetu z profilem z Facebook.com – wszystkie wersje Presta Shop
Rozwiązanie jest dość intuicyjne
rozwiązanie ogranicza się do:
- wklejenia kodu w 1 plik
- wgraniu 1 pliku graficznego.
Właściciele sklepów najczęściej wychodzą z założenia, że liczy się efekt stąd nasze sprytne rozwiązanie.
Dodatkowo działa ono niezależnie od wersji Presta Shop.
Osadzenie kodu HTML
Otwieramy plik:
1
|
/themes/{NAZWA-NASZEGO-SZABLONU}/footer.tpl |
Następnie na samym końcu tego pliku znajdujemy zamknięcie znacznika BODY i HTML:
1
2
|
</ body > </ html > |
Zaraz przed tym kodem wklejamy poniższy kod. Z tym, że w miejscu:
{TUTAJ WPISZ ADRES TWOJEJ STRONY NA FACEBOOK}
wstawiamy adres naszej strony na Facebook.com (usuwamy ten wpis wraz z klamrami) np. https://www.facebook.com/prestashopkrakow/
Przy okazji zachęcamy do polubienia naszego fan page to modywuje nas do nowych wpisów
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
|
< div id = "facebook_slider" > < div id = "fbox1" style = "right: -300px; top: 50%; z-index: 10000;" > < div id = "fobx2" style = "text-align: left;width:290px;height:350px;" > < a class = "open" id = "fblink" href = "#" ></ a >< img style = "top: 0px;left:-50px;" src = "/img/facebook-icon.png" alt = "" > < iframe src = "//www.facebook.com/plugins/likebox.php?href={TUTAJ WPISZ ADRES TWOJEJ STRONY NA FACEBOOK}/&width=290&height=370&show_faces=true&colorscheme=light&stream=false&border_color=%23FFF&header=false" scrolling = "no" frameborder = "0" style = "border:none; overflow:hidden; width:290px; height:370px;" allowTransparency = "true" ></ iframe > </ div > </ div > < script type = "text/javascript" > {literal} jQuery(function (){ jQuery("#fbox1").hover(function(){ jQuery('#fbox1').css('z-index',101009); jQuery(this).stop(true,false).animate({right: 0}, 500); }, function(){ jQuery('#fbox1').css('z-index',10000); jQuery("#fbox1").stop(true,false).animate({right: -300}, 500); }); }); {/literal} </ script > < style type = "text/css" > #facebook_slider { position: relative; } #fbox1 { background-color: #fff; border: 5px solid #3c95d9; border-radius: 5px; position: fixed; } #fbox2 { overflow: hidden; text-align: left; } #fbox1 img { border: 0 none; cursor: pointer; position: absolute; top: 0; z-index: 10000; } #fbox1 iframe { border: 0 none; height: 100%; overflow: hidden; position: absolute; width: 100%; } </ style > |
Wgranie pliku graficznego
Do folderu na serwerze:
1
|
/img |
Wgrywamy ten plik: facebook-icon.png
Wyczyszczenie pamięci podręcznej.
Musimy mieć jeszcze pewność, że zmiany są widoczne na stronie i odświeżony jest system pamięci podręcznej w sklepie. W tym celu w zależności od wersji wchodzimy:
Presta Shop 1.6
Zaawansowane » Wydajność » Wyczyść pamięć podręczną (przycisk u góry tej podstrony)
Presta Shop 1.5
Zaawansowane » Wydajność » przycisk „Wyczyść cache Smarty i Autoload”
Wchodzimy następnie na stronę sklepu (widoczną dla klientów) i sprawdzamy czy widget jest widoczny.
Jeśli nie – asekuracyjnie możemy też zaznaczyć opcję „Wymuś kompilację” na powyższej podstronie „Wydajność” – zapisać następnie odświeżyć stronę kliencką.
W momencie, kiedy widget się pojawi – przywracamy ustawienie na stronie „Wydajność” do takiego jak przed zmianą.