Savjeti / Prikaz izmjenjivih fotografija u zaglavlju stranica


Rotiranje heder fotografija

Vi možete vizuelno poboljšati svoj heder pomoću rotiranja fotografija unutar istog. Rotiranje fotografija će Vam omogućiti da prikažete mnogo fotografija u ograničenom području i tako podržite informacije na svojoj web stranici na vrlo atraktivan način.


Sa Slideroll web servisom možete rotirati sve svoje slike unutar slideshowa ugrađenog u heder Vaše stranice. Ili, sa jednostavnim HTML rješenjem koje će uz pomoć isječka HTML koda rotirati slike samo kada se stranica ponovo učita.


Izmjena fotografija sa Slideroll servisom

Koristeći Slideroll, možete napraviti izmjenjive fotografije u hederu samo odabirom slika sa svog računara. Slideroll će generisati flash fajl koji rotira ove fotografije, a Vi možete integrisati ovaj fajl na svoj web pomoću HTML snippeta.


Slideroll nudi Basic i Pro verziju. Osnovna verzija će vam omogućiti da kreirate do 10 slide show animacija sa maksimalnom veličinom od 360 x 240 piksela, i koristiti će do 100 slika za prikaz slajdova. Pro verzija omogućuje veličine do 800 x 600 piksela i do 5000 fotografija.


Zbog gore navedenih ograničenja, ako je širina Vašeg hedera veća od 800 piksela, slideshow će zauzimati samo dio hedera.

Da bi kreirali slideshow sa Slideroll servisom, pratite slijedeće korake:

1. Otvorite korisnički račun na Slideroll

2. Nokon logiranja kliknite Slideshow Creator



 

 

3. Kliknite na Upload Photos



4. Kliknite Select Photos to Upload ili koristite Drag and Drop upload opciju (u primjeru ispod koristili smo Drag and Drop upload). Nakon završetka kliknite Done/OK.



5. U Slideshow Properties popup prozoru, unesite veličinu  slideshowa i vrstu animacije.  Neka veličina bude kao i heder na Vašem sajtu (ne zaboravite ograničenja osnovnog Slideroll računa).



6. Povucite slike na timeline i odredite koji će dio slike biti prikazan u slideshowu, koristeći se prozorom u kojem vidite veći prikaz slike. Kliknite Save.



7. Kliknite na Publish dugme u donjem desnom uglu. Selektujte high quality, loop, i autoplay kućice iz popup prozora. Kliknite na dugme Publish u popup prozoru.



 

8. Vaš će se slideshow pojaviti u novom prozoru (ako ste isključili pop-upove, selektujte Play Again da bi se otvorio popup). Odaberite Get Link i kopirajte dio označenog linka (1):



9. Za dodavanje slideshowa u heder Vaše stranice, dodajte HTML snippet ispod hedera stranice. U HTML snippet kopirajte jedan od slijedeća dva koda, ovisno o tome koji dizajn koristite. Zamijenite istaknuti dio koda sa dijelom linka koji ste kopirali (korak 8):


Dizajn

                Code to be used

Sirius, Vega, Atria, Kuma

<script type="text/javascript">
var so = new SWFObject("http://www.slideroll.com/player.swf?s=abc12def ", "flashmovie", "100%", "100%", "7");
so.addParam("quality", "high");
so.addParam("wmode", "transparent");
so.addParam("base", "http://www.slideroll.com");
so.addParam("scale", "noscale");
so.addParam("salign", "tl");
so.addVariable("encoding", SK.Singletons.env.get('encoding'));
so.write("fm_page_image");
</script>

Pasta, Cocoa, Futuretech, Aurora

<style type="text/css">
#pageImageBar { background-image: none; }
</style>
<script type="text/javascript">
var so = new SWFObject("http://www.slideroll.com/player.swf?s=abc12def", "flashmovie", "100%", "100%", "7");
so.addParam("quality", "high");
so.addParam("wmode", "transparent");
so.addParam("base", "http://www.slideroll.com");
so.addParam("scale", "noscale");
so.addParam("salign", "tl");
so.addVariable("encoding", SK.Singletons.env.get('encoding'));
so.write("pageImageBar");
</script>


Kliknite na Update i flash sadržaj bi se trebao pojaviti u hederu stranice.


Rotiranje heder slika jednostavnim HTML rješenjem.