Przejdź do treści

Nowość

W jaki sposób sygnalizować nowości na stronie?

Nowość

W serwisie WWW przydatne może się okazać zasygnalizowanie użytkownikowi wprowadzonych ostatnio nowości, poprzez umieszczenie w spisie treści (bezpośrednio obok danej pozycji) albo obok daty aktualizacji (na każdej ze stron) specjalnego obrazka lub napisu, wskazującego, że pozycja ta została ostatnio zaktualizowana. W ten sposób użytkownik już podczas przeglądania spisu treści odnajdzie wszystkie nowości. Zaletą użycia skryptu jest to, że nie musimy pamiętać o usunięciu obrazka (napisu) nowości, ponieważ po nadejściu podanego dnia (i godziny), obrazek sam zniknie z ekranu. Potem w dowolnym czasie (np. przy następnej aktualizacji serwisu) wystarczy tylko usunąć zbędny kod, aby niepotrzebnie nie zaśmiecał źródła dokumentu.

Aby zasygnalizować nowość, należy wstawić w treści nagłówkowej dokumentu (wewnętrz <head>...</head>) następujący kod:

<script>
function nowosc(dzien, miesiac, rok, godzina, minuta, napis, obrazek)
{
	var obrazek_domyslny = 'nowosc.gif';	// lokalizacja obrazka
	var napis_domyslny = 'NOWOŚĆ';	// tekst alternatywny
	
	if (typeof obrazek == 'undefined') obrazek = obrazek_domyslny;
	if (typeof napis == 'undefined') napis = napis_domyslny;
	if (typeof godzina == 'undefined') godzina = 0;
	if (typeof minuta == 'undefined') minuta = 0;
	
	if (new Date(rok, miesiac-1, dzien, godzina, minuta) > new Date()) document.write(obrazek ? '<img src="' + obrazek + '" alt="' + napis + '"' + (napis != '' ? ' title="' + napis + '"' : '') + '>': napis);
}
</script>

Dla poprawnego działania skryptu, w wyróżnionych miejscach należy wpisać:

nowosc.gif
Domyślna lokalizacja obrazka, który ma zostać wyświetlony dla zasygnalizowania nowości. Nawet jeśli wpiszemy jakąś ścieżkę dostępu, możemy ją później zmienić dla pojedynczych pozycji na stronie. Dlatego podaje się tutaj lokalizację obrazka, który będzie najczęściej używany dla sygnalizowania nowości.
NOWOŚĆ
Domyślny tekst alternatywny, który pojawi się w przypadku,gdy przeglądarka użytkownika nie będzie mogła wyświetlać obrazków oraz dodatkowo po wskazaniu obrazka myszką. Jeśli chcesz zrezygnować z tekstu alternatywnego, nie wpisuj tutaj nic.

Następnie w wybranym miejscu strony wpisujemy:

<script>
nowosc(rok,miesiąc,dzień);
</script>

gdzie wyróżniony fragment: "rok,miesiąc,dzień", należy zastąpić datą, która podaje, kiedy dana pozycja przestaje już być nowością.

Pierwszą część powyższego kodu należy wstawić na stronie tylko jeden raz (w treści nagłówkowej). Natomiast druga część może pojawić się dowolną ilość razy - w zależności od liczby nowości.

Można również zapisać ten skrypt w osobnym pliku z rozszerzeniem *.js - np. nowosc.js, a następnie w nagłówku dokumentu wpisać tylko:

<script src="nowosc.js"></script>

Trzeba jednak wtedy koniecznie pamiętać o usunięciu z niego dwóch pierwszych i dwóch ostatnich linijek!

Przykład

Opcje nowości

Możliwe są również inne sposoby wywołania funkcji nowości:

  1. Z podaniem dodatkowo czasu wygaśnięcia nowości:
    <script>
nowosc(rok,miesiąc,dzień, godzina,minuta);
</script>

    UWAGA! Zarówno "dzień", "miesiąc" jak i "godzinę" oraz "minutę" nie należy poprzedzać wiodącym zerem, jeśli stanową one liczbę mniejszą od 10. Ponadto "rok" musi być liczbą czterocyfrową. Trzeba również pamiętać, że jako "godzinę" podaje się liczbę z zakresu 0-23. Zapis: nowosc(2003,2,1, 0,4); jest poprawny, natomiast: nowosc(03,02,01, 00,04); - błędny!

  2. Ze zmienionym tekstem alternatywnym:
    <script>
nowosc(rok,miesiąc,dzień, godzina,minuta, 'tekst');
</script>

    Pamiętaj, aby treść tekstu alternatywnego objąć w apostrofy oraz aby nie używać już wewnątrz niego apostrofów! Jeżeli chcesz zmienić tekst alternatywny dla wszystkich nowości na stronie, lepiej to zrobić "zbiorczo" w pierwszej części kodu.

    Przykład

  3. Bez tekstu alternatywnego:
    <script>
nowosc(rok,miesiąc,dzień, godzina,minuta, '');
</script>

    Przykład

  4. Ze zmienionym obrazkiem nowości:
    <script>
nowosc(rok,miesiąc,dzień, godzina,minuta, 'tekst', 'lokalizacja obrazka');
</script>

    Przykład

  5. Bez obrazka, ale z napisem wyświetlanym bezpośrednio na stronie:
    <script>
nowosc(rok,miesiąc,dzień, godzina,minuta, 'tekst', '');
</script>

    W tym przypadku w treści napisu można dodatkowo użyć znaczników HTML, np. w celu pogrubienia tekstu albo zmiany jego koloru. Można nawet wstawić odsyłacz prowadzący bezpośrednio do strony z nowością.

    Przykład



Komentarze

Zobacz więcej komentarzy

Facebook