Initializing...
Dodawanie JavaScripts, Html na stronie (na podstawie przykładów).

JavaScript jest potężnym językiem skryptowym bardzo przydatnym do dodawania interaktywnych treści na swojej stronie internetowej. Często zadawane pytanie na naszym forum jest "Jak dodać skrypt do mojej strony?
Niestety nie ma jednej ogólnej odpowiedzi na tak postawione pytanie. Każdy javascript wymaga innego podejścia.
Jednak w tym poradniku postaram się podać kilka wskazówek, które łatwiej zrozumieć gdzie należy wstawiać konkretne kawałki JavaScript.
Należy pamiętać, że kiedy już znalazłeś ciekawy JavaScript w Internecie, to często jest też dostępna instrukcja konfiguracji oraz jak zintegrować go ze swoją stronią, więc ważne jest, aby przeczytać te instrukcje przed dodaniem konkretnego skryptu.

Rozpatrzmy kilka scenariuszy na podstawie przykładów:
Zanikanie Ticker Tape Script

Krok 2: Drugi etap to dodanie kodu, który służy do wyświetlenia
Ticker Tape.
W WYSIWYG Web Builder będziemy użyjemy obiektu HTML aby wstawić ten kod. Umieścimy obiekt HTML w tym samum miejscu gdzie ma się
Ticker Tape.
Wybieramy wiec Menu-> Dodaj-> HTML

Krok 3: Na koniec musimy jeszcze dodać kod w znaczniku <body>:
Wybierz Menu-> Strona-> Strona HTML i kliknij zakładkę Wewnątrz Tagu Body ('Inside body tag") a w karcie wpisujemy ten kod:
onload="if (ie||ns6||ns4) {regenerate2();updatecontent()}"
Uwagi
Zmiana treści komunikatu i odnośnika odbywa się poprzez edycję zawartości w tablicy news[0], news[1]  (krok 2).

Upewnij się, że rozmiar obiektu HTML jest taki sam jak wymiary ticker-a określony w arkuszu stylów (krok 1).
Aby zmienić "szerokość" i wysokość " edytując arkusz stylów dla
Ticker Tape:
width: 400px;
height: 200px;
Html - Dodanie widgetu pogody na swojej stronie internetowej (PL).

Krok 3: Kliknij Pobierz Kod. Pobierz kod z okna np:dla Warszawy będzie to:
<iframe frameborder="0" marginwidth="0" marginheight="0" width="300" height="210" scrolling="NO" src="http://instytutmeteo.pl/userwidget/sitewidgets?id=10&city_id=756135"></iframe>

Krok 1: Pierwszym krokiem jest wstawienie kodu w sekcji <head> swojej stronie. Kod ten odpowiada za styl ticker-a.
W WYSIWYG Web Builder wybieramy:
Menu-> Strona-> Strona HTML i wybieramy dodanie kodu "pomiędzy <head> <head>", w oknie wpisujemy nagłówek i kod:
JS-Dodawanie odtwarzacza MP3 na swojej stronie internetowej.

Skrypt ten jest dostępny na http://www.jeroenwijering.com/?item=JW_MP3_Player

Krok 1: Pobierz pliki ze strony internetowej.
Krok 2: Rozpakuj plik pliki na dysku lokalnym. Na przykład C: \ jw_mp3_player \
Krok 3: Dodaj poniższy kod do sekcji <head> strony przez (Menu->Strona-> Strona HTML i kliknij zakładkę 'Between Head Tag'
<script type="text/javascript" src="swfobject.js"></script>
Krok 4: Dodaj odtwarzacz MP3 na swojej stronie przy pomocy obiektu HTML.
Menu-> Dodaj:> "<>HTML"  i wpisz ten kod:
<p id="player1"><a href="http://www.macromedia.com/go/getflashplayer">Get the Flash Player</a> to see this player.</p>
<script type="text/javascript">
var s2 = new SWFObject("mp3player.swf", "playlist", "240", "135", "7");
s2.addVariable("file","playlist.xml");
s2.addVariable("backcolor","0x00000");
s2.addVariable("frontcolor","0xEECCDD");
s2.addVariable("lightcolor","0xCC0066");
s2.addVariable("displayheight","0");
s2.write("player1");
</script>
Krok 5: Musimy jeszcze dodać niezbędne pliki z MP3 Player-a które zostaną dodane do strony.
Dodaj obiekt Opublikuj pliki  (Menu->Dodaj> Zaawansowane-> Opublikuj pliki)  i dodaj następujące pliki:
mp3player.swf
playlist.xml
song1.mp3
song2.mp3
swfobject.js
Zauważ, że te pliki są zawarte w katalogu c:\ jw_mp3_player\  które wcześniej wyodrębniłeś  z pliku zip do tego katalogu (w kroku 2)!

Krok 6: Aby dodawać własne utwory, należy edytować plik playlist.xml zmieniając wpisy np. song1.mp3 i song2.mp3  na własne nazwy  plików, oczywiście własne utwory mp3 też musisz opublikować dodając je w  Opublikuj pliki.
Dokładniejsze informacje znajdziesz w dokumentacji dołączonej do JW MP3 Player-a .



Krok 4:
Dodaj obiekt <>HTML, otwórz do edycji i wklej pobrany kod w pole html. Ustaw Kod Html na: Use <div> to set position and size the HTML. Akceptuj wprowadzone ustawienia (OK).
Krok 5: Ustaw rozmiary obiektu <>HTML na takie jaki wybrałeś rozmiar widgetu (w przykładzie 300X210).Ustaw obiekt na odpowiedniej pozycji w której ma być wyświetlany.

UWAGI:
Dla widgetu (z ID="Html_meteo") dodano obwódkę i efekt cienia dodając
w kodzie Html strony Zakładka Pomiędzy HEAD nast.kod:
<style type="text/css">
#Html_meteo
{
   border: 1px #C0C0C0 solid;
   -moz-box-shadow: 3px 3px 8px #3C3C3C;
   -webkit-box-shadow: 3px 3px 8px #3C3C3C;
   box-shadow: 3px 3px 8px #3C3C3C;
   padding: 0px 0px 0px 0px;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
}
</style>

Tutoriale powiązane tematycznie:
Dodawanie kodu HTML lub JavaScript do strony internetowej
Adding cool image effects using the Script.aculo.us Javascript



Wejdź na stronę: http://instytutmeteo.pl/widgety_pogodowe
Krok 1: W polu wyszukiwania wpisz nazwę miejscowości dla której chcesz aby
pogoda była prezentowana.Jeśli pojawi się kilka wybierz tą właściwą. Kliknij Szukaj.
Krok 2: Z dostępnych widgetów wybierz ten który cię interesuje
(wymiary, wygląd, zawartość informacji).
Wyjście
---Home------Download------Zakup------Poradniki Online------Szablony------Wsparcie------Forum------Rozszerzenia------Manual------Rózne---
Copyright © 2017