ForumCała strona

Nawigacja

Aktualnie online

Gości online: 4

Użytkowników online: 0

Łącznie użytkowników: 25,386
Najnowszy użytkownik: Hisfatt

Logowanie

Nazwa użytkownika

Hasło



Zarejestruj się

Odzyskaj hasło

Shoutbox

Musisz zalogować się, aby móc dodać wiadomość.

Zbigniew@
01.04.2024 12:28:45
Wszystkiego najlepszego z okazji świąt.

JazOOn
28.02.2024 19:25:31
ja zostałem przy fusionie ale nazywa się 360. Projektowanie i druk 3d...

MajsterBieda
25.02.2024 00:12:42
Ponad 20 lat .... tosz to sioook panie.... Grin

JazOOn
24.02.2024 20:32:31
a już na pewno mamuty

JazOOn
24.02.2024 20:31:59
Albo dinozaury

Pobierz nową wersję
Pobierz podręcznik
Zobacz inne oficjalne Supporty
Statystyki supportu
PHP-Fuson PL na Facebooku

RSS

Polecamy hosting SferaHost.pl

Zobacz temat

 Drukuj temat
Nivo Slider Panel - jQuery Image Slider w panelu
aszynka
Witam serdecznie forumowiczów, zrobiłem sobie ostatnio prostą stronkę w PHP Fusion v7 i chciałbym dodać Nivo Slider (nivo.dev7studios.com) do panela powitalnego, ale jestem strasznie blady w takich rzeczach i nie wiem jak sie za to zabrac. Bardzo prosze o pomoc.


PW od moderatora:
  1. Zmiana nazwy tematu - hoopak 06.04 - 17:24
  2. Przeniesienie tematu - hoopak 06.04 - 17:25

Edytowane przez Pieka dnia 06.04.2011 19:04:51
 
Wścibski Gość
Dodany dnia 18.04.2024 12:57:18
Pan Kontekstualny

Postów: n^x
Data rejestracji: Zawsze

Polecamy hosting SferaHost.pl
IP: localhost  
Chemikpil
Ogólnie to masz wszystko ładnie opisane u nich na stronie, ale skoro niema tam sposobu dla PHP-Fusion to zaraz to ogarniemy. Zakładam że znasz podstawy CSS bo zaimplementowaniu panelu, samemu trzeba resztę ustawić.

Nie napisałeś jaką masz skórkę więc ja robiłem to na Gillette, ale nie powinno być problemu z implementacją w innej. Dobra jazda :)

1. Po ściągnięciu paczki i jej rozpakowaniu, kopiujemy pliki
jquery.nivo.slider.pack.js
nivo-slider.css

do katalogu includes.
2. Teraz musimy dodać te pliki tak by slider mógł zadziałać. Wykorzystam tu OH (dzięki Pieka :)). Tworzymy nowy panel, wklejamy do niego ten kod:
Pobierz kod źródłowy  Rozwiń Kod źródłowy

... zapisujemy i włączamy.
3. Zdjęcia, które maja się przewijać, wrzucamy do katalogu images/nivo (katalog nivo musisz utworzyć).
4. W PA w miejscu gdzie umieszczamy treść panelu powitalnego ustawienia->główne umieszczamy ten kod zamiast starego (UWAGA!!! jest to kod proponowany przez twórce, więc tu musisz go rozkminić sam i dodać taki jaki chcesz, ten dodajemy dla sprawdzenia czy panel zadziała):
Pobierz kod źródłowy  Rozwiń Kod źródłowy

Ja nie nadawałem twardych ścieżek do obrazków, ale ty możesz.
5. Teraz musimy dodać kod CSS do pliku styles.css naszej skórki, u mnie to themes/Gillette/styles.css:
Pobierz kod źródłowy  Rozwiń Kod źródłowy

6. Na sam koniec musimy uruchomić nasz slider. Przykładowa metoda na stronie twórcy mówi że ten kod:
Pobierz kod źródłowy  Rozwiń Kod źródłowy

umieszczamy w sekcji head naszej strony czyli pliku header.php, jednak ja jestem zwolennikiem czystości kody i lepiej jest umieścić to w osobnym pliku. Zakładam że nie masz żadnego własnego pliku JavaScript więc w katalogu skórki utwórz nowy plik np. nivo-slider.js, umieść w nim ten kod:
Pobierz kod źródłowy  Rozwiń Kod źródłowy

i zapisz.
By dodać plik do sekcji head naszej strony ponownie skorzystamy z OH. Musimy więc poddać edycji nasz wcześniej utworzony panel i w miejsce starego kodu wkleić ten:
Pobierz kod źródłowy  Rozwiń Kod źródłowy
. Ponownie zapisujemy panel.

Ogólnie to wszystko, pozostaje kwestia kodu CSS dla przycisków prev i next, oraz dla paginacji obrazków (1,2,3,... etc). Pozostawiam to dla Ciebie choćby jako ćwiczenie, w końcu jak chcesz się nauczyć inaczej niż przez praktykę.
U mnie zadziałało, lecz nie posiadam własnej strony testowej w sieci więc nie mogę Tobie udowodnić :)
Pozdro.
Edytowane przez Chemikpil dnia 13.04.2011 22:19:42
Nie pisać na GG i PW w sprawach technicznych!
ChemikPil - blog (w nowej odsłonie) | ChemikPIL - My twitter
 
www.chemikpil.pl
Pieka
Michal, a nie lepiej podac to, co ma byc w header w formie panela? Nie bedzie musial grzebac w plikach.
Jestem jaki jestem Smile
 
www.php-fusion.pl
Chemikpil
Pieka napisał/a:
Michal, a nie lepiej podac to, co ma byc w header w formie panela? Nie bedzie musial grzebac w plikach.

Mówisz o OH? Można wtedy wyglądało by to tak:
1. Tworzymy nowy panel i umieszczamy w nim ten kod:
Pobierz kod źródłowy  Rozwiń Kod źródłowy

Zapisujemy i włączamy :).
Edytowane przez Pieka dnia 13.04.2011 20:48:33
Nie pisać na GG i PW w sprawach technicznych!
ChemikPil - blog (w nowej odsłonie) | ChemikPIL - My twitter
 
www.chemikpil.pl
Pieka
Warto wkomponowac to w tresc pierwszego Twojego posta, bo bedzie balagan Wink
Jestem jaki jestem Smile
 
www.php-fusion.pl
Chemikpil
Mini-tutorial poprawiony Smile W sumie lepiej wygląda z OH, o którym zawsze zapominam ;/
Nie pisać na GG i PW w sprawach technicznych!
ChemikPil - blog (w nowej odsłonie) | ChemikPIL - My twitter
 
www.chemikpil.pl
aszynka
Dziala jak marzenie! Dzieki wielkie Grin Po zgrzewce piwa Wam wiszę Pfft
 
Klubowo
Hmm..zrobiłem tak jak opisywał Chemikpil,i nie wyświetla się... Shock

Moja strona www.[cenzura]

Proszę o pomoc bo próbowałem już chyba wszystkiego... Frown
Edytowane przez Pieka dnia 08.07.2011 23:24:07
 
Gismo_PL
Zacznij najpierw od porządku w swoim kodzie. Nawaliłeś kilkukrotnie odwołania do tych samych plików skryptowych i styli, że aż mi się odechciewa dalszego przeglądania. Rób z głową pewne modyfikacje a nie bezmyślnie kopiujesz i wklejasz gdzie popadnie z myślą, że może zadziała.
 
http://fsong.pl
Klubowo
Zacznij najpierw od porządku w swoim kodzie. Nawaliłeś kilkukrotnie odwołania do tych samych plików skryptowych i styli, że aż mi się odechciewa dalszego przeglądania. Rób z głową pewne modyfikacje a nie bezmyślnie kopiujesz i wklejasz gdzie popadnie z myślą, że może zadziała.


Pewnie akurat wtedy byłeś na mojej stronie jak próbowałem kombinować po omacku. Pfft

Sprawa wyglądała prosto,w ostatnim kodzie który podał Chemikpil zmieniłem "gillette" na "Gillette" i działa.

Panel śmiga na 7.02.00. Smile
 
Pieka
I stad wniosek, ze warto stosowac okreslone stale, w tym przypadku THEME zamiast THEMES.
Jestem jaki jestem Smile
 
www.php-fusion.pl
Chemikpil
Pieka napisał/a:
I stad wniosek, ze warto stosowac okreslone stale, w tym przypadku THEME zamiast THEMES.

Dokładnie. Kod w moim poście został już poprawiony Smile
Nie pisać na GG i PW w sprawach technicznych!
ChemikPil - blog (w nowej odsłonie) | ChemikPIL - My twitter
 
www.chemikpil.pl
Pieka
Tylko wywal tego slasha Wink
Jestem jaki jestem Smile
 
www.php-fusion.pl
Chemikpil
Chemikpil napisał/a:
Ogólnie to masz wszystko ładnie opisane u nich na stronie, ale skoro niema tam sposobu dla PHP-Fusion to zaraz to ogarniemy. Zakładam że znasz podstawy CSS bo zaimplementowaniu panelu, samemu trzeba resztę ustawić.

Nie napisałeś jaką masz skórkę więc ja robiłem to na Gillette, ale nie powinno być problemu z implementacją w innej. Dobra jazda :)

1. Po ściągnięciu paczki i jej rozpakowaniu, kopiujemy pliki
jquery.nivo.slider.pack.js
nivo-slider.css

do katalogu includes.
2. Teraz musimy dodać te pliki tak by slider mógł zadziałać. Wykorzystam tu OH (dzięki Pieka :)). Tworzymy nowy panel, wklejamy do niego ten kod:
Pobierz kod źródłowy  Rozwiń Kod źródłowy

... zapisujemy i włączamy.
3. Zdjęcia, które maja się przewijać, wrzucamy do katalogu images/nivo (katalog nivo musisz utworzyć).
4. W PA w miejscu gdzie umieszczamy treść panelu powitalnego ustawienia->główne umieszczamy ten kod zamiast starego (UWAGA!!! jest to kod proponowany przez twórce, więc tu musisz go rozkminić sam i dodać taki jaki chcesz, ten dodajemy dla sprawdzenia czy panel zadziała):
Pobierz kod źródłowy  Rozwiń Kod źródłowy

Ja nie nadawałem twardych ścieżek do obrazków, ale ty możesz.
5. Teraz musimy dodać kod CSS do pliku styles.css naszej skórki, u mnie to themes/Gillette/styles.css:
Pobierz kod źródłowy  Rozwiń Kod źródłowy

6. Na sam koniec musimy uruchomić nasz slider. Przykładowa metoda na stronie twórcy mówi że ten kod:
Pobierz kod źródłowy  Rozwiń Kod źródłowy

umieszczamy w sekcji head naszej strony czyli pliku header.php, jednak ja jestem zwolennikiem czystości kody i lepiej jest umieścić to w osobnym pliku. Zakładam że nie masz żadnego własnego pliku JavaScript więc w katalogu skórki utwórz nowy plik np. nivo-slider.js, umieść w nim ten kod:
Pobierz kod źródłowy  Rozwiń Kod źródłowy

i zapisz.
By dodać plik do sekcji head naszej strony ponownie skorzystamy z OH. Musimy więc poddać edycji nasz wcześniej utworzony panel i w miejsce starego kodu wkleić ten:
Pobierz kod źródłowy  Rozwiń Kod źródłowy
. Ponownie zapisujemy panel.

Ogólnie to wszystko, pozostaje kwestia kodu CSS dla przycisków prev i next, oraz dla paginacji obrazków (1,2,3,... etc). Pozostawiam to dla Ciebie choćby jako ćwiczenie, w końcu jak chcesz się nauczyć inaczej niż przez praktykę.
U mnie zadziałało, lecz nie posiadam własnej strony testowej w sieci więc nie mogę Tobie udowodnić :)
Pozdro.

Nie pisać na GG i PW w sprawach technicznych!
ChemikPil - blog (w nowej odsłonie) | ChemikPIL - My twitter
 
www.chemikpil.pl
Dudeek
Zrobiłem wszystko zgodnie z instrukcją i smiga na Google Chrome, lecz w Firefox czy Internet Explorer pokazują się obrazki pod obrazkami, w czym może tkwić problem?

//wszystko działa
Edytowane przez Dudeek dnia 14.04.2011 17:38:03
 
djdandi
Mam pytanie dlaczego nie ma obrazków tylko są napisy Prev i Next.
Dałem obrazki do katalogu mojego thema/images
Pozdrawiam all
 
http://pogoda.brzanekonline.pl
Konto ukryte
A w ogóle czytałeś uważnie post? Obrazki dodaje się do folderu images/nivo.
Edytowane przez Pieka dnia 17.07.2011 11:36:00
 
djdandi
ok to może inaczej chodzi o to że jak wejdziesz na stronę http://nivo.dev7s... i najedziesz na obrazek to pojawiają się strzałki po lewej i po prawej stronie oraz pod spodem jest loader a u mnie tego nie ma zamiast tych obrazków pojawiają się napisy Prev i Next teraz rozumiesz. Wszystko mam zrobione jak podaje instrukcja.
Dodam jeszcze to że chcę dać to w theme.php a nie w wiadomości powitalnej.
W theme.php dałem taki kod
Pobierz kod źródłowy  Rozwiń Kod źródłowy PHP

Edytowane przez djdandi dnia 17.07.2011 11:41:57
Pozdrawiam all
 
http://pogoda.brzanekonline.pl
emil90ck
djdandi napisał/a:
ok to może inaczej chodzi o to że jak wejdziesz na stronę http://nivo.dev7s... i najedziesz na obrazek to pojawiają się strzałki po lewej i po prawej stronie oraz pod spodem jest loader a u mnie tego nie ma zamiast tych obrazków pojawiają się napisy Prev i Next teraz rozumiesz. Wszystko mam zrobione jak podaje instrukcja.
Dodam jeszcze to że chcę dać to w theme.php a nie w wiadomości powitalnej.
W theme.php dałem taki kod
Pobierz kod źródłowy  Rozwiń Kod źródłowy PHP


Podaj prawidłową lokalizacje plików graficznych :)
Najlepiej podaj cały adres wraz z www lub zastosuj zmienne.
 
http://www.bluemoney.pl
djdandi
No ale przeglądałem wszystkie pliki które są podane w instrukcji napisanej przez Chemikpil i nie ma tan nic odnośnie tych strzałek i tego loadera.
Gdzie powinno umieścić się pliki skórek załączonych razem z Nivo Slider.
Pozdrawiam all
 
http://pogoda.brzanekonline.pl
Przejdź do forum:
Created by Arox Copyright (C) 2004
Copyright (C) 2004 - 2018 Ekipa PHP-Fusion.pl