Forum Blogowe 17 lat!

Blogerzy wszystkich platform, łączcie się!

Dyskusje Blogerów, Fotoblogerów i Vlogerów, fora blogowe, graficzne, ogólnotematyczne
rozmowy o blogach, porady, instrukcje, ciekawostki z internetu
FAQFAQ    UżytkownicyUżytkownicy  grupa Blogger Polska! na FBBlogger Polska!  GrupyGrupy  regulaminRegulamin RejestracjaRejestracja  ZalogujZaloguj

»  »  »  »  ::
Autor Wiadomość
misiuniaunia 
Blogger.Klub

Dołączyła: 01 Lut 2013
Posty: 35
  Wysłany:    [blogger] Jak zrobić z boku bloga gadżety w kartach?
Na blogu l0ve.blogg.no na prawym pasku bocznym jest napisane ''profil,kategori,arkiv'' jak zrobić taki gadżet na swoim blogu?
 
  podziel si� tym postem na:



Utwórz darmowe konto na forum --- Zaloguj się --- Polub Blogowicza na FB!
Dołącz do grupy Bloggerów na FB

Htsz 
Blogger Product Expert
Blogowicz.Team


Zaproszone osoby: 84
Imię: Arkadiusz Narowski
Pomógł: 816 razy
Wiek: 38
Dołączył/a: 01 Sty 2006
Posty: 8948
Miasto: Wrocław
Wysłany: 2013-10-14, 09:17   jQuery Organic Tabs - zakładki aktywne po kliknięciu w kartę
Robiłem już kiedyś takie aktywne karty na jednym z blogów wordpress:
Wiadomość (widoczna dla zarejestrowanych)
tutaj dodatkowo same przełączają się co określony czas.

Fajny bajer, urozmaica nieco stronę. Pomaga zmniejszyć ilość miejsca zajmowanego przez pasek boczny bloga.

W źródle bloga l0ve.blogg.no znalazłem odnośnik, który poprowadził mnie do strony z instrukcją:
Wiadomość (widoczna dla zarejestrowanych)

Wszystko jest tam fajnie wytłumaczone, pokazane przykłady działania.

Kilka podpowiedzi:

1. Kod HTML wklejamy sobie do gadżetu HTML/Javascript. Będziemy mieli go zawsze pod ręką (wprowadzanie zmian / dodawanie elementów)

2. Kod CSS możemy wrzucić także do widżetu HTML, na początek:

Kod

<style id='tabs-forum-blogowicz-info' type='text/css'><!--
tutaj CSS
--></style>
albo do sekcji <b:skin> w szablonie. Polecam razem z tym .hide

3. Skrypt jQuery - tutaj sprawa się nieco komplikuje, bo warto to mieć w pliku, ja poradziłem sobie z tym publikując zawartość na Google Drive (masz dostęp w ramach konta Google za darmo). Jakiś czas temu pisałem jak zdobyć bezpośredni link do pliku - wystarczy to samo zrobić w wrzuconym skryptem. Jak nie GD to jakikolwiek hosting plików, który dopuszcza hotlink i javascript.
Jak chcesz bezpośrednio do źródła gadżetu/bloga to wtedy tak:

Kod

<script type="text/javascript">
tutaj JS
</script>
w tym przypadku, w ostatniej partii do wklejenia pomijasz to:
Wiadomość (widoczna dla zarejestrowanych)
na koniec wywołanie biblioteki jQuery i funkcji organicTabs - zapisujemy zmiany.

Jeżeli chodzi o wyświetlanie kart w pionie - to kwestia CSS. Konkretnie position oraz transform. Żeby obrócić nasze karty potrzebujemy listę UL nav zamknąć w dodatkowy DIV, efekt będzie mniej więcej taki:
Wiadomość (widoczna dla zarejestrowanych)
dopiszemy także fragment do CSS:
Wiadomość (widoczna dla zarejestrowanych)
oczywiście wartości własne (left, top, obrót).

Sprawdzałem na swoim testowym blogu i wszystko działa.
______________________________________________________
nie radzisz sobie? :arrow: pomoc indywidualna oraz blogi i strony na zamówienie
zapraszam do przewodnika po forum oraz grupy Blogger Polska! na fb
Think before you post™ | ^_^ na każdego posta znajdzie się riposta™

Jeżeli nasze posty pomogły rozwiązać Twoje problemy możesz odwdzięczyć się, udostępniając link do tego forum na swoim blogu, fanpejdżu lub stronie!
Nie zapomnij kliknąć lubię to! na facebooku. :^^:
 
  podziel si� tym postem na:
misiuniaunia 
Blogger.Klub

Dołączyła: 01 Lut 2013
Posty: 35
Wysłany: 2013-11-13, 20:39   
Dziękuję za pomoc powyżej, ale nie działa mi przechodzenie między zakładkami, mógłbyś spojrzeć na blog: Allinnes.blogspot.com i powiedzieć mi co musiałabym zmienić, aby działały jak na blogu: l0ve.blogg.no ?
 
  podziel si� tym postem na:
Htsz 
Blogger Product Expert
Blogowicz.Team


Zaproszone osoby: 84
Imię: Arkadiusz Narowski
Pomógł: 816 razy
Wiek: 38
Dołączył/a: 01 Sty 2006
Posty: 8948
Miasto: Wrocław
Wysłany: 2013-11-14, 01:38   
Próbowałaś wstawiać bez zmieniania nazw? Jak będzie wszystko ok, to wtedy zacznij edytować skrypty, CSS i HTML. Niektóre nazwy są użyte w innym miejscu kilkukrotnie, trzeba je podmienić w każdym z nich.

p.s. jak ktoś zna się dobrze na edycji HTML/CSS/JS/Blogger, to może wykorzystać ten skrypt do zrobienia bocznego paska, który będzie miał w tych zakładkach poukrywane całe gadżety.
Trzeba edytować szablon, przygotować sobie oddzielne sekcje i oznaczyć je odpowiednimi IDentyfikatorami a potem użyć ich w kodzie skryptu by się pomiędzy nimi przełączać.

Zainteresowanych takim rozwiązaniem zapraszam prywatnie.
______________________________________________________
nie radzisz sobie? :arrow: pomoc indywidualna oraz blogi i strony na zamówienie
zapraszam do przewodnika po forum oraz grupy Blogger Polska! na fb
Think before you post™ | ^_^ na każdego posta znajdzie się riposta™

Jeżeli nasze posty pomogły rozwiązać Twoje problemy możesz odwdzięczyć się, udostępniając link do tego forum na swoim blogu, fanpejdżu lub stronie!
Nie zapomnij kliknąć lubię to! na facebooku. :^^:
 
  podziel si� tym postem na:
Wyświetl posty z ostatnich:   
»  »  »  »  ::
Odpowiedz do tematu
Nie możesz pisać nowych tematów. Zobacz szczegły.
Nie możesz odpowiadać w tematach. Zobacz szczegły.
Nie możesz zmieniać swoich postów
Nie możesz usuwać swoich postów
Nie możesz głosować w ankietach
Nie możesz załączać plików na tym forum
Nie możesz ściągać załączników na tym forum
 Dodaj temat do Ulubionych
Wersja do druku

Skocz do:  

Powered by phpBB & Weblove.pl © 2006-2024 Wrocław | modified by Przemo © 2003 phpBB Group.
↑ skocz na górę ↑   |  shoutbox
 
Dodaj na Facebooku:

Zobacz także:


Szablony blogów i stron na wordpress
ogromna baza motywów WP, podzielona na kategorie tematyczne. Proste, jednostronicowe wizytówki lub zaawansowane układy, także z funkcją sklepu internetowego (ecommerce).
Wyszukaj na Blogowiczu:
snapchat blogowicz instagram blogowicz