O Internecie, oprogramowaniu oraz moich własnych małych projektach...
Blog > Komentarze do wpisu

Wyróżnienie własnych komentarzy

Na pewno nie raz zdarzyło Ci się oglądać efekt wyróżnienia własnych komentarzy przez autora bloga. Stanowią one atrakcyjny element, który pozwalając na łatwiejsze odnalezienie jego wypowiedzi wpływa na poprawę interakcji z czytelnikami.
Oto krótki skrypt, który umożliwi Ci osiągnięcie takiego efektu także na Twoim bloksie.
Aktualizacja 2007/01/28
Skrypt oraz sposób jego wywołania zostały zmienione, tak aby możliwe było jego poprawne działanie przy wąskiej szpalcie umieszczonej po lewej stronie.

Wykorzystanie skryptu na bloksie

Przygotowanie skryptu

Pobierz plik blox.comments.js. Otwórz plik skryptu, a następnie zamień mój nick na własny edytując następującą linię:

var Authors = ["s.z.y.m.o.n"];

Jeżeli autorów bloga jest więcej, wówczas umieść wszystkie nicki rozdzielone przecinkiem wewnątrz nawiasu kwadratowego, np.

var Authors = ["nick1", "nick2", "nick3"];

Zmodyfikowany plik dodaj do zasobów swojego bloga.

Modyfikacja kodu HTML bloga

Umieść w polu na kod HTML, najlepiej jako ostatni wpis, taki oto kod:

<script type="text/javascript" src="/resource/blox.comments.js"></script>

Ostylowanie wyróżnionych komentarzy

Aby wyróżnić komentarz należy jeszcze dodać w arkuszu CSS odpowiednie deklaracje dla zaznaczanych komentarzy.
Komentarze kolejnych użytkowników są oznaczane dodatkową klasą. Nazwa klasy różni się dla każdego użytkownika przyjmując odpowiednio wartości KomentarzAutora0 dla pierwszego autora, KomentarzAutora1 dla drugiegi itd.

Jeżeli jesteś jedynym autorem lub nie potrzebujesz różnych klas dla każdego z autorów, to zamień w skrypcie linię:

div.parentNode.className += " KomentarzAutora"+j;

na następującą

div.parentNode.className += " KomentarzAutora";

Wówczas wszystkie komentarze autorów będą oznaczane dodatkową klasą KomentarzAutora.

Przykładowa definicja zmieniająca kolor czcionki na czerwony wygląda następująco:

.KomentarzAutora0{color: red}

Mam nadzieję, że skrypt okaże się przydatny. Zachęcam do zamieszczania ewentualnych uwag, jak i informacji o wykorzystaniu na blogu, w komentarzach.

sobota, 06 stycznia 2007, s.z.y.m.o.n
Tagi: blox

Polecane wpisy

TrackBack
TrackBack w tym blogu jest moderowany. TrackBack URL do wpisu:
Blox.pl i magia jQuery - zwijane archiwum i zakładki, wyróżnianie komentarzy autora z KosciaKowy blog
Podczas przygotowywania nowego szablonu dla mojego bloga natrafiłem na problem z archiwum i zakładkami - zajmowały zdecydowanie za dużo miejsca. Rozwiązanie było tylko jedno - użyć skryptu pozwalającego na ich zwijanie i rozwijanie. Gotowe rozwiązania ... »
Wysłany 2009/11/14 17:18:37
Komentarze
sgk
2007/01/07 23:18:56
A czy nie można jakoś wywołać funkcji MarkAuthorsComments() wewnątrz skryptu comments.js?

Czy znasz jakieś dobre materiały w internecie dotyczące JavaScript: jakieś manuale, spisy funkcji, itp?
-
2007/01/09 02:27:44
Można ;)
Wystarczy umieścić jej wywołanie na końcu pliku.

Jutro (dziś) postaram się uzupełnić opis.

Jeżeli chodzi o JavaScript sporo ostatnio szperam na:
developer.mozilla.org/pl/docs
-
2007/01/22 20:28:17
A co jesli blog ma dwoch autorów ? Jak wyroznic wpisy?
-
2007/01/23 20:02:07
Można wywołać funkcję markAuthorsComments() dwukrotnie, za każdym razem z inny nickiem jako parametrem.

Jeżeli zależy Ci na jednokrotnym wywołaniu napisz maila na skrzynkę w gazecie, to podeśle lekko zmienioną wersję.
-
sgk
2007/01/24 13:14:37
Zrobiłem u siebie. Działa.

Mam drobne uwagi:
Deklaracja language="javascript" w wywołaniu skryptu jest chyba zbędna(?).
Zasoby bloga są w podkatalogu /resource (bez s)
Kod CSS najlepiej wstawić na końcu sekcji dotyczącej komentarzy.
-
2007/01/24 17:59:14
Faktycznie deklaracja language="javascript" nie jest konieczna (chyba, że dla bardzo starych przeglądarek).
Dzięki za zwrócenie uwagi na błąd w linku.
Jeżeli chodzi o CSS, to w tym przypadku położenie definicji w arkuszu, poza jego przejrzystością, nie ma większego znaczenia.
-
sgk
2007/01/24 23:31:01
No z tym CSS to położenie w arkuszu wg mnie ma znaczenie.
Umieszczenie deklaracji .KomentarzAutora PRZED .InfoPar/.InfoNiepar może nie dać oczekiwanych efektów. Lepiej dać ją PO, bo deklaracje późniejsze są ważniejsze niż wcześniejsze, odnoszące się do danego obiektu.
Przynajmniej taki był efekt moich dzisiejszych doświadczeń.
-
2007/01/25 01:05:57
Faktycznie, troszkę się pośpieszyłem z tą oceną znaczenia położenia.
Określenie ważności danej deklaracji w CSS jest jednak jeszcze bardziej skomplikowane, bo zależy także od stopnia specyficzności selektora.

Dla większej pewności można określić element za pomocą obu klas:
.InfoPar.KomentarzAutora, .Infoniepar.KomentarzAutora{}
-
sgk
2007/01/28 00:58:04
Jedna z użytkowniczek zauważyła, że ten mechanizm działa tylko w przypadku wąskiej szpalty po prawej stronie. To by się zgadzało, bo gdy skrypt jest po lewej, to ładuje się zanim załaduje się treść komentarzy.
Czy da się jakoś opóźnić działanie skryptu do momentu załadowania całej strony?
-
taisha_te
2007/01/28 17:55:13
serdecznie dziękuję za tak szybką aktualizację :-) i w ogóle za całość, to bardzo przydatny skrypt, jeśli można wykorzystam go wszechstronnie, polecając np. bloxowiczom, którym robię szabloniki
-
s.z.y.m.o.n
2007/01/28 18:09:57
Jeżeli byłabyś zainteresowana, to mam jeszcze skrypt pozwalający wraz z CSSem przekształcić archiwum w rozwijane menu. Skrypt w działaniu można zobaczyć u mnie na głównej stronie bloga (troszkę szwankuje pod IE, ale to kwestia CSSa).

Za jakiś czas (tydzień/dwa) jego opis pojawi się na blogu
-
taisha_te
2007/01/29 16:20:11
to bardzo ciekawe rozwiązanie i myślę, że się przyda, szczególnie tym, którzy piszą już długo
-
s.z.y.m.o.n
2007/01/29 18:35:22
Dlatego pomyślałem o Tobie, zwłaszcza przy okazji przebudowy jaką prowadzisz ostatnio na blogu.

Jeżeli chciałabyś go otrzymać wcześniej, to napisz na pocztę w gazecie lub poprzez jabbera (mój identyfikator, wraz ze statusem, jest w wąskiej szpalcie).
-
pasiwo
2007/02/24 10:35:39
skorzystalam, dziekuje:))
-
2007/03/25 14:55:43
Skorzystałam, dziękuję, nie działa :))
-
2007/03/25 15:00:09
Jeżeli jesteś jedynym autorem lub nie potrzebujesz różnych klas dla każdego z autorów, to zamień ze sobą następujące linie w skrypcie:

div.parentNode.className += " KomentarzAutora"+j;

oraz

div.parentNode.className += " KomentarzAutora";

tego nie znalazłam, więc nie miałam co zamieniać temu nie działa. Pomijam, że mam pop prawej a coś eskey pisze...

Albo... nie wpisałam w blox.comments.js zlotoslanos, a to drugi autor. Temu?
-
2007/03/25 16:12:45
@Cito: Troszkę niejasno napisałem - powinno być "zamień na" - już poprawiłem.
Wpisanie obu autorów jest konieczne.
Co do tej linii do zamiany, to domyślnie ustawiłem inne klasy dla każdego autora. Podmiana wskazanej linii powoduje, że komentarze wszystkich autorów będą miały taką samą klasę.
-
pasiwo
2007/04/20 14:42:50
hmmm.. maly problem mam. Skorzysralam jak juz wyzej pisalam z wyroznienia wlasnych komentarzy i ... od kilku dni nie dziala ani w Operze, ani w Firefoxie, ani na jednym, ani na drugim blogu:( Dzialalo bez zastrzezen. Czy wiesz jaka moze byc tego przyczyna?
-
auel
2007/06/18 07:13:44
Uczę się CSS na Twoim szablonie. Jest różny od dotychczas oglądanych. Podoba mi się, że opisujesz miejsca poprzez dodanie informacji w wyróżnieniu /*/.
Nieśmiało sugeruję zamianę litery r na rz w polu WYKONANIE.
Pozdrawiam
-
shi-ann
2007/07/12 02:53:00
Czy jest za możliwe za pomocą tego bloga zmienić kolory tylko nicków autorów (każdemu z autorów bloga przypisać inny) w komentarzach?
-
shi-ann
2007/07/12 02:54:18
a nie bloga ;-)
-
shi-ann
2007/07/12 02:56:57
W pierwszym komentarzu sie pomyliłam w drugim coś zjadło mi pół zdania może za trzecim razem się uda...
Oczywiście w pierwszym komentarzy miałam na myśli zmiany za pomocą przedstawionego skryptu, a nie za pomocą bloga ;-)

Chyba najwyższy czas iśc spać...
-
s.z.y.m.o.n
2007/07/12 10:05:54
@shi-ann: Oczywiście, że można - patrz sekcje Przygotowanie skryptu i Ostylowanie wyróżnionych komentarzy.

Aby zmienić tylko kolor nicka wystarczy dodać w CSSie (dla każdego z autorów linijkę):

.KomentarzAutora0 a{color: KOLOR_LINKU}

Oczywiście za każdym razem dodając na końcu KomentarzAutora odpowiedni numer 0, 1, 2...
-
2007/07/12 11:38:48
Dzięki za odpowiedź.
-
2007/07/29 22:41:11
Fajny pomysł z tym skryptem. Pozwoliłem go sobie trochę przerobić, a właściwie skorzystać z pomysłu i napisać własny skrypt, który robi to samo, ale nie do końca. Mój skrypt oznacza wypowiedzi autora danej notki, a nie wszystkich autorów bloga. Nie wymaga też żadnej konfiguracji, bo nazwa autora jest znajdowana automatycznie na podstawie podpisu pod notką. Działanie można zobaczyć na moim blogu maupa.blox.pl/2007/07/Komentarze-autora.html Zapraszam i pozdrawiam.
P.S. Próbowałem dodać trackback do tej notki na swoim blogu ale coś mi nie wyszło :/ (error 503)
-
s.z.y.m.o.n
2007/07/30 17:31:35
@e-maupa: zapewne jakiś chwilowe kłopoty na bloksie, bo truckback jest włączony. Może spróbuj ponownie później ;)

Twoje rozwiązanie też ciekawe ;)
-
sylwiap77
2008/01/23 00:27:22
s.z.y.m.o.n
może wyda Ci się to śmieszne pytanie (jestem zupełnie zielona ;), ale jak dodać "avatara" do swojego wyróżnionego komentarza??
-
s.z.y.m.o.n
2008/01/23 00:35:21
@sylwiap77:
W tym celu trzeba skorzystać ze skryptu przygotowanego przez DeBergeraca
-
sylwiap77
2008/01/23 00:38:52
I jeszcze jedno. Piszesz:
"Aby wyróżnić komentarz należy jeszcze dodać w arkuszu CSS odpowiednie deklaracje dla zaznaczanych komentarzy",
ale jakie deklaracje mam wpisać?? Jak to dokładnie brzmi, by zadziałało.
-
sylwiap77
2008/01/23 00:46:57
Czyli jak nie jestem zarejestrowanym na MBL to nic nie zwojuję. Wielka szkoda. :(((
-
s.z.y.m.o.n
2008/01/23 01:08:53
@sylviap77:
Przykład ze zmianą koloru czcionki jest w tekście.
Co do MyBlogLog, to skoro nie masz tam konta, to nie zobaczysz własnego awatara (to akurat można obejść za pomocą CSS), ale gości mających takowe konta już tak ;)
-
2008/05/03 12:59:52
Witaj,
gdzie dokładnie mam zmienic lub wpisac formułkę ".KomentarzAutora0{color: red}" w pliku który dodaje do zasobów czy w w arkuszu CSS znajdujacym sie na blogu? Nie widze tam takiego elementu, gdzie go szukac, albo gdzie go dopisac?
Pozdrawiam
(mam nadzieje ze moje pytania nie sa idiotyczne :))
-
s.z.y.m.o.n
2008/05/06 16:23:59
@oklat
Patrz sekcja Ostylowanie wyróżnionych komentarzy
Dodajemy do kodu CSS szablonu (tego wpisu tam raczej jeszcze nie będzie).
Ten kod CSS proponuję zmodyfikować, bo to jedynie przykład i raczej kiepsko wygląda.
-
wojtekb.1
2008/08/28 14:28:25
Pobrałem skrypt na blog masterton0wojtekb.blox.pl. Świetna rzecz. Pozdrawiam.
-
2010/03/11 02:54:46
Skrypt działa prawidłowo pod IE, FF, Chrome.
Niestety pod Operą 10.50 nie działa, a szkoda, bo to właśnie z niej zawsze korzystam.
-
2010/03/11 09:52:21
POPRAWKA:
Jednak skrypt zaczął "nagle" działać również w Operze.
-
szary-burek
2012/12/15 14:42:43
A jak wyróżnić komentarz autora poprzez zmianę tła komentarza? kombinuje i wymyślić nie mogę.
Skrypt ostatnie komentarze w nowej wersji
Po sporych perturbacjach skrypt wraca do życia. Teraz z prostym generatorem kodu do w klejenia na blogu!
Wszyskich zainteresowanych zapraszam do ponownej instalacji.
Czytaj dalej...
Promuj swojego bloksa
Czytelnicy mogą promować Twojego bloga umieszczając linki do notek w serwisach społecznościowych. Ułatw im to zadanie dodając na blogu listę odnośników, która tą czynność sprowadzi do jednego kliknięcia.
Czytaj dalej...