poniedziałek, 5 maja 2014

Szablon "kafelkowy" zamiast tradycyjnego

Pełną wersję postu znajdziesz na: okiem-tyler.blogspot.com

"Kafelki" na blogach to coraz popularniejsze rozwiązanie. Jednak czytając artykuły czy przeglądając kolejne blogi, które zdecydowały się na "kafelkowy" szablon pojawia się pytanie: Jak sprawić naszemu blogu "kafelki"? Inaczej, jak stworzyć szablon "kafelkowy"?

Specjaliści z forum blogowego  proponują nam dwie opcje:
  • edycję kodu HTML;
  • edycję stworzonego już "szablonu kafelkowego" na nasze potrzeby;
Ja tworząc szablon na Okiem Tyler zdecydowałam się na szablon kafelkowy i opcje drugą. Tą też opcję Wam polecam, jeśli nie do końca czujecie się pewnie edytując kod HTML, dużo bardziej wolicie zabawę CSS'em lub też zwyczajnie układ/wygląd pewnego szablonu kafelkowego Wam odpowiada. No i nie macie dużo czasu, a chcecie stworzyć coś oryginalnego i fajnego na Waszego bloga.

Jednak i w przypadku opcji drugiej nie zawsze jest tak kolorowo. Ale wszystko zależy od naszego "widzimisię" i efektu jaki chcemy uzyskać.
Szablon, który ja wybrałam to: Nivex.
Szablon, który chciałam stworzyć to: Hooked up by the fire ( chodziło o odtworzenie kolumn, układu i najbardziej rzucających się w oczy elementów )
Jako, że Tyler zdecydowanie lubi sobie komplikować życie to zadanie, które miała do wykonania nie należało do najłatwiejszych i wymagało prawie 3 godzin pracy ( z przerwami ). Jednak efekt był dosyć zadowalający, dlatego też z dumą mogę napisać ten post.

Po kilku godzin praktyk z "kafelkami" muszę stwierdzić, że i opcja pierwsza, jak i druga nie nadają się dla kompletnych początkujących. Chociaż wszystko też zależy od tego, jaki efekt nas interesuje, a także jak bardzo lubimy bawić się w kodzie i jak bardzo pewni jesteśmy w jego edycji. Prawda jest taka, że wszystko jest dla ludzi i wszystko da się zrobić.

Zachęcam do przeczytania pełnej wersji postu na Okiem Tyler, a także do odwiedzenia tego bloga, który jest moim najnowszym projektem, i który mam nadzieję Was zaciekawi. W jednym zdaniu mogę opisać to tak, że jest to wszystko co bardziej teoretyczne, to co poza wierszami w kwestii prowadzenia Graphical Thoughs czy tworzenia szablonów... Oj, inaczej to można jeszcze tak, że jest to to czego nie widać na GT, ale jest i jest niemniej ważne od całej reszty.

Na samym końcu chciałabym zadać Wam pewne pytanie, które tyczy się tego tematu, i które było pewnym impulsem do napisania tego postu. Mianowicie:
Czy chcecie, aby szablony kafelkowe były ogólnodostępne do pobrania na Graphical Thoughts?
Również ciekawi mnie czy chcielibyście nieco bardziej praktycznych porad dotyczących "kafelków". Np. dotyczących edycji takich szablonów, jak również wykonania takiego szablonu samodzielnie. Jeśli tak to oczywiście zostawcie swoją opinie, a Tyler dla Was oczywiście zrobi wszystko. 
Ot, takie skromne pytanka. Zachęcam do dyskusji i zostawienia swojej opinii.

Zachęcam także do przedstawienia swoich propozycji - czy to na post, instrukcję, szablon - w Propozycjach. Staramy się to ogarnąć i wziąć pod uwagę Wasze pomysły. No między innymi to w propozycjach znalazło się pytanie: mogłabyć dac instrukcje (jak umiesz) naszablon kafelkowy, które również zachęciło mnie do zgłębienia się w ten temat.

Trzymajcie się!

12 komentarzy:

  1. Jak będę po maturach, to przeczytam każde powyższe słowo, kochanie :D

    OdpowiedzUsuń
  2. Ooj, oczywiscie, że chcemy takie szablony do pobrania na Twoim blogu :) I pomysl na tego bloga jest genialny ^^

    [Tak z anonima, bo z telefonu ;c]

    OdpowiedzUsuń
  3. Przegląd programów graficznych jak najbardziej trafiony. Pracując jeszcze na poprzednim Grafikus'ie pisałam instrukcje do Photoshopa, Photofiltre (darmowy, mozliwe że podobny do Photoscape'a), Photofiltre Studio (rozwinieta wersja poprzedniego), GIMPa. Jednak tych trzech ostatnich uczyłam sie na siłę, chyba tylko dla czytelników, którzy jednak do Photoshopa dostępu nie mieli. Zarzuciłam to jednak przy obecnym blogu. Chyba wolę się skupić na tych konkretnych programach niż bawić się w inne. I w GIMPie również denerwowało mnie to, w ilu on sie oknach otwiera! Wkurzające.
    Szablon mi się podoba, kolory również! Są prosto fajne. A najlepsze, że od kilku zajęć w tej kolorystyce powstają etykiety na syropy owocowe robione przez koleżankę z roku ;) A teraz jeszcze analogicznie robi okładkę płyt.
    Zaczełam czytać post o "kafelkach", doszłam do końca i stwierdziłam, że nie wiem, co to te "kafelki". Brawo ja! Ale wpadłam na "oczko...", doedukowałam się, zaobserwowałam nowy blog, na którym podoba mi sie ten szablon! Aż chce mi się robić na swoim blogu jakis nowy, kurczaki. A tu przydałoby się wziąć za zaliczenia :D

    OdpowiedzUsuń
  4. Warto pamiętać, że większość kafelków tworzona jest w oparciu o JavaScript, który w rzeczywistości pobiera cały wpis by wyświetlić z niego zdjęcie i kawałek treści. Dlatego nie można zapominać o używaniu zwijania tekstu podczas pisania notki. Pozwoli to odciążyć podstrony bloga.

    Automatyczne skróty postów da się zrobić także bez JS, ale tym się jeszcze nie dzieliłem na forum. Na razie wykorzystuję tę metodę w skórkach na życzenie, ostatnio w szablonie dwukolumnowym, który reaguje na szerokość okna przeglądarki.

    OdpowiedzUsuń
    Odpowiedzi
    1. Bardzo dziękuję za zwrócenie uwagi. Aż tak dobrze tej funkcji nie znam, dlatego na pewno Twój komentarz będzie pomocny nie tylko dla mnie, ale także dla czytelników.
      Jest to zresztą bodajże moje pierwsze zderzenie z JS, dlatego działam ostrożniej niż zwykle.
      Z chęcią bym dowiedziała się o drugiej opcji tworzenia takich postów, jednak w tej chwili chyba postawię na JS. Chciałabym dojść do wprawy, poznać ten efekt i się nim troszkę pobawić. A szablon naprawdę robi spore wrażenie. :)

      Muszę również napisać, że to wielki zaszczyt otrzymać komentarz od takiej osoby jak Pan. :)

      Pozdrawiam,
      Tyler

      Usuń
    2. Dziękuję za uznanie. Tobie również się należy. To jedna z ciekawszych, polskich stron z instrukcjami. Większość nie ma pojęcia o czym pisze albo ślepo kopiuje zagraniczne poradniki.

      Usuń
  5. Pobrałam ten szablon na swój blog, prezentuje się cudownie, naprawdę.
    Jest minimalistyczny, schludny i przejrzysty. Cudo.

    OdpowiedzUsuń
  6. Naprawdę przydatna instrukcja. Dziękuję, od jakiegoś czasu szukałam czegoś podobnego. :)
    Tylko mam takie małe pytanko...
    Jest możliwość zmienienia kształtu tych "kafelków"? Mam na myśli np. jakieś koła, elipsy, coś w tym stylu.
    Z góry dziękuję. ;)

    OdpowiedzUsuń
    Odpowiedzi
    1. Tutaj trzeba by po prostu znaleźć odpowiedni selektor i na nim popracować. Zdjęcie, cały "box" posta, czy może sam tekst pojawiający się na stronie głównej. :)
      + dla obrazka: jak już wszystkie kody załadujesz na bloga, to wyszukaj ten odpowiadający za obrazek ( jest on nawet uwzględniony w instrukcji link ) i przy nim możesz zmieniać parametry lub ( tak jak jest napisane ) dodać klasę i dodawać resztę już w CSSie.
      +dla całego posta lub samego tekstu: tutaj zadziałają podstawowe selektory bloggera - .post-body, .date-outer itp. - tylko trzeba być ostrożnym i uważać, ponieważ te same kody sprawdzą się już "po wejściu" w post. Można również zastosować warunkowanie dla wybranych stron i uwzględnienie tam bardziej "kłopotliwych" elementów.
      Jeśli jednak używasz gotowego szablonu z nieco innymi selektorami to może być pewien kłopot, ale zawsze da się znaleźć ten odpowiedni. :)
      Nie jestem pewna czy udało mi się jakoś pomóc. Ale brak mi umiejętności, która pozwoliłaby mi bez próbowania wskazać dobre rozwiązania i pomysły. Pracuje nad tym jednak. ;)
      Jak coś to zawsze możesz napisać z konkretną sprawą do mnie na maila i można jakoś już indywidualnie się wszystkiemu przyjrzeć.
      Kontakt to oczywiście bizarre1309@gmail.com <3
      Trzymaj się :)

      Usuń
    2. Bardzo dziękuję, naprawdę mi tym pomogłaś. :)
      Mam nadzieję, że się uda...

      Usuń
  7. Przepraszam, ale jest napisane, że na "Okiem Tyler" wejść nie mogę, ponieważ blog jest tylko dla zaproszonych czytelników. Jak więc mam ujrzeć treść instrukcji, skoro nie mam dostępu do bloga, na którym się znajduje?
    Pozdrawiam.

    OdpowiedzUsuń

- +
Szablon wykonany przez Tyler