Szukasz gotowego szablonu na swojego bloga? A może chcesz stworzyć go od podstaw samemu? W obu przypadkach ( a także, w 457663 innych ) dobrze trafiłeś! Na Graphical Thoughts znajdziesz wymarzony szablon na swojego bloga. Możesz również przestudiować nasze instrukcje, które pomogą Ci zmienić Twój blog w cudo!

21.07.2014 - TUTORIAL - Nieruchome menu na górze strony
14.07.2014 - SZABLON - A lifetime of adventure
04.07.2014 - ARTYKUŁ - Co i jak, by było przejrzyście?
Znudził Ci się widok bloggerowego archiwum? A może chciał(a)byś zaszaleć z efektem dla swojego menu? Tak? To miejsce dla Ciebie! Znajdziesz tu nie tylko ciekawe efekty dla poszczególnych gadżetów czy elemtentów na blogu, ale zobaczysz też jak wszystko wygląda od kuchni. Trochę podstawowych efektów, troszkę zaawansowanych i co nieco kodowych ciekawostek!
Wszystkie instrukcje staramy się przydostosowywać i dla początkujących, i dla tych, dla których kodowanie jest już dobrym przyjacielem! Jeśli mimo wszystko czegoś nie rozumiesz lub coś jest niejasno wyjaśnione, prosimy o jak najszybszy kontakt!
Jeśli masz pomysł na jakąś instrukcje pisz do nas! - na maila ( bizarre1309@gmail.com ), w komentarzach lub tagboardzie!
Przejdź do listy instrukcji
Zamówienia
złóż zamówienie na swój własny, niepowtarzalny szablon
Graphical Thoughts to nie tylko miejsce, gdzie możesz poznać podstawy tworzenia szablonów bloggera, ale także znaleźć gotowy szablon na swojego bloga. Każdy szablon tworzymy z wielką dokładnością, starając się, aby wszystkie elementy odpowiednio się ze sobą zgrały. Przy każdym szablonie znajdują się również dodatkowe instrukcje, które pomogą Ci urozmaicić prostą bazę szablonu, o gadżety zawarte na podglądzie.
Jednak pobierając pamiętaj o przestrzeganiu poniższego regulaminu:
  • Pobierając szablon zostaw krótką informacje ( komentarz, mail, wiadomość w tagboardzie ).
  • Pobrany szablon jest tylko do użytku własnego.
  • Zmiany w szablonie są dopuszczalne, jednak przy tychże zmianach, niech Ci ręka nie lata i przypadkiem nie usunie creditu autorki.
  • Jeśli masz problem z pobranym szablonem, opisz problem w komentarzach ( polecana opcja, dzięki temu rozwiązanie problemu będzie dostępne dla wszystkich pobierających ), w mailu lub w tagboardzie
  • Ciekawi Cię efekt w szablonie? W takim wypadku nie ściągaj go i nie grzeb w kodzie, a po prostu napisz, a z uśmiechem na ustach wyjaśnie cóż to takiego.
  • Od 1.06.2014 szablony są systematycznie uzupełniane o hasła. Jeśli natrafiłeś na szablon opatrzony hasłem, po zapoznaniu się z regulaminem zostaw komentarz pod najnowszym postem, wpisując: hasło, które pojawiło się w regulaminie w najnowszym poście, nazwę szablonu, który chcesz pobrać oraz Twój e-mail, gg lub konto na deviantArt, gdzie do 24h wyślemy hasło. Bardzo prosimy o nie udostępniania haseł, szczególnie, że co jakiś czas będą one zmieniane.
Przejdź do galerii szablonów
Wszystkie posty
wszystkie notki, które pojawiły się na blogu
Po raz trzeci zostaliśmy najlepszym blogiem grupowym! Jeśli wciąż uważacie nasz blog za pomocny, zachęcam do głosownia na GT tym razem na:
najlepszy blog grupowy lipca Katalogu Graficznego;
SZABLON WYKONANY PRZEZ TYLER DLA BLOGA
G R A P H I C A L T H O U G H T S.BLOGSPOT.COM
2014
KONTAKT:AFFABRE.SIS@GMAIL.COM | BIZARRE1309@GMAIL.COM

Monday, July 21, 2014

Przycisk "Do góry" - czyli strzałeczka przenosząca do góry bez scrollowania

Od razu warto wspomnieć, że poniższa instrukcja pochodzi z Gumdi.com ( instrukcja ), poniżej zaprezentowany jest sposób, który znajdziecie w tym źródle. Sposób sprawdzony i działający.

Po pierwsze warto napisać, że w jedynym gadżecie HTML upchniemy jQuery, kody CSS i HTML. Oczywiście można każdy fragment przenieść do odpowiedniego miejsca w kodzie HTML szablonu, ale może nie utrudniajmy sobie już i tak łatwej pracy. 

W takim razie do dzieła. 
Jak już zapewne zauważyliście zaczynamy prawie standardowo, czyli:

Układ > Dodaj gadżet ( w obojętnym miejscu ) > HTML/JavaScript

Następnie do pola tekstowego dodajemy po kolei:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script>
jQuery(document).ready(function() {
var offset = 220;
var duration = 500;
jQuery(window).scroll(function() {
if (jQuery(this).scrollTop() > offset) {
jQuery('.back-to-top').fadeIn(duration);
} else {
jQuery('.back-to-top').fadeOut(duration);
}
});
jQuery('.back-to-top').click(function(event) {
event.preventDefault();
jQuery('html, body').animate({scrollTop: 0}, duration);
return false;
})
});
</script>

Jak widać jest to część jQuery.
<style>
div#page {
max-width: 900px;
margin-left: auto;
margin-right: auto;
padding: 20px;
}
.back-to-top {
position: fixed;
bottom: 2em;
right: 0px;
text-decoration: none;
color: #000000;
background-color: rgba(235, 235, 235, 0.80);
font-size: 12px;
padding: 1em;
display: none;
}
.back-to-top:hover {
background-color: rgba(135, 135, 135, 0.50);
text-decoration: none;
}

</style>
Skupiamy się na .back-to-top, czyli wyglądzie naszego przycisku i .back-to-top:hover
Na koniec zostaje nam stworzyć przycisk, który przeniesie nas na górę strony!
<a href="#" class="back-to-top">Back to Top</a>
Zmieniamy niebieski tekst powyżej na nazwę przycisku, ja wybrałam "do góry!"
Mam nadzieję, że się przyda i, że zadziała. A dowód tego drugiego tutaj ( no nie taki do końca dowód, ale na pewno na GT taki przycisk się pojawić musi! ) . :)

Nieruchome menu na górze strony

     Zmotywowałam się i usiadłam do komputera, otworzyłam zakładkę z zamówieniami, zaczęłam nawet jakieś robić... a potem stwierdziłam, że instrukcja - notabene, wyczekiwana od paru dni przez kilka osób - zajmie mi mniej czasu i dlatego najpierw notka, a potem zamówienia. Przy okazji muszę Wam się przyznać, że całkowicie oszalałam na punkcie nowego kawałka Guetty (: Lovers on the sun jakoś tak sprawia, że aż podskakuję na krzesełku! Przy okazji, na gorzko słodko pojawił się nowy layout główny - co sądzicie? Chciałyby tygrysy coś takiego tutaj?

     Ale do rzeczy.

Nieruchome menu na górze strony

     Powyżej dwa przykłady - zwykłego, kolorowego oraz z obrazkiem w tle. Zasada jest jednak taka sama w obu przypadkach. Na przykładach nie ma co prawda social icons, a o to też była prośba, ale to dodamy sobie na końcu. Co można powiedzieć o tego typu menu? Wbrew pozorom nie jest ono trudne do zrobienia i tak naprawdę zamyka się w dwóch poleceniach - position: fixed; oraz display: inline, ale po kolei.


     Step 1 - jaki gadżet na menu?

     Tak naprawdę możemy zarówno użyć gadżetu "Strony", jak i ramki HTML/Java. Osobiście preferuję jednak to pierwsze, bo dużo łatwiej z nimi kombinować, dodawać nowe linki, usuwać, i tak dalej. A do tego z automatu możemy ustawić nasze strony u góry strony, gdzie linki są jeden obok drugiego, a nie pod sobą. Poniżej daję obraz układu, z którego ja będę korzystać. Ramka HTML/Java jest potrzebna wtedy, kiedy chcemy mieć nasze ikonki. Oczywiście, ramka ta może być gdziekolwiek na stronie, jednak im wyżej i bliżej stron, tym lepiej i łatwiej.


     Step 2 - let's make it ready.
     Zawsze powtarzam, że zanim zaczniemy pracę, lepiej wszystko przygotować. Jeśli chodzi o menu, powinniśmy już z miejsca wiedzieć, jakie karty chcemy w nim mieć, prawda? Home, kategorie, spis treści... kto, co woli, ten to ma. Dlatego zanim przystąpimy do kodowania, dodajmy wszystko, co chcemy mieć w menu w takiej kolejności, jakie to ma być. Dlaczego? Otóż, jeśli ktoś ma więcej linków, musi wiedzieć, jaką czcionkę dopasować, żeby wszystko było okay. Poza tym, od razu widać jak na dłoni, czy menu nam się podoba, czy jest w ogóle do kitu i trzeba kombinować dalej ;) Obrazek niżej... no cóż, póki co nie wygląda to zbyt apetycznie, ale co zrobić?

     Step 3 - let's... kod, cz. 1. i już.
     Wszystko, co będziemy pisać i kombinować, tylko i wyłącznie - na szczęście - w arkuszu CSS w projektancie szablonów. Jakimi selektorami będziemy się posługiwać? Wszystkie będą miały coś wspólnego z #PageList1 (jeśli coś poknociliście, to ewentualnie #PageList2, ale wątpię)

#PageList1 ul - wykaz, czyli... po prostu nasze menu. Ujdzie też bez "ul".
#PageList1 ul li - linki same w sobie, w kolumnie bocznej również te kropeczki, których tutaj nie ma.
#PageList1 li a:link - kolor linków stron, efekty, itp.
#PageList1 li a:visited - strona odwiedzony. 
#PageList1 li.selected a - wybrana aktualnie strona.
#PageList1 li a:hover - strona po najechaniu.
     W poniższych wskazówkach wszystko to, co będzie kolorem, będziecie mogli zmienić na własny użytek. To, co będzie normalną czcionką, powinno zostać niezmienione, by uzyskać taki efekt, jak na pierwszym zdjęciu

     Step 4 - come to me, baby. Czyli dziecko mamusi w nawiasach.
     Ale ze mnie dowcipniś...
     A poważnie - jakich użyć poleceń, żeby wszystko grało i hulało? Idziemy po kolei wg podanych wyżej selektorów. 
#PageList1 {z-index: 10;} #PageList1 ul {background: #FF3A31; position: fixed; top: 0px; left: 0px; right: 0px; border-bottom: 1px dotted #000}
     Jak już wyżej wspomniałam, ten selektor to ogólnie wszystko, na czym potem się opieramy. A więc kolor naszego ogólnego tła [background] (tutaj to jest ten... koralowy?). W tym miejscu pozycjonujemy również nasze strony, by były one cały czas na górze, a do tego nieruchomo względem przewijania bloga - do tego służy position: fixed; top: 0px; left: 0px; right: 0px. Dzięki temu tło naszych stron zaczyna i kończy się na bocznych granicach monitora, niezależnie od rozdzielczości. Border-bottom jest oczywiście opcjonalny i odpowiada za ten 1px ramki dolnej. (!) Gdybyśmy chcieli mieć za tło obraz, jak w przypadku design your life, to zamiast background pojawiłoby się background-image: url(adres obrazka). Do tego nasze z-index, dzięki czemu nasze menu jest ciągle na górze i nic go nie przysłania.
     Jak to teraz wygląda?


     Step 5 - one by one.
      Można by pomyśleć, że skoro teraz są w równym rzędzie, to nie trzeba nic robić, no ale dla świętego spokoju dodajemy kolejny selektor, a w nim kolejne komendy. Float, czyli tak jakby... nalot? Nie wiem, jak to wytłumaczyć, ale przykładowo, gdyby zamiast none było right, to wszystko pofrunęłoby na prawą stronę. Display, czyli wyświetlenie, inline, czyli w linii. 
#PageList1 ul li {float: none; display: inline;}
     Możecie sprawdzić, co się dzieje, gdy dacie jedno z nich i pewnie bardziej zrozumiecie, czemu lepiej to dodać, niż z moich pokrętnych wyjaśnień ;) Dzięki temu też odstępy między stronami są równe.

     Step 6 - fonts.
     Teraz zajmiemy się przez chwilę tym, co w ogóle widzimy cały czas, czyli czcionkami. Tutaj jest pełna dowolność jakby co.

#PageList1 li a:link, #PageList1 li a:visited {text-transform: uppercase; color: #fff; padding: 10px 20px; font-family: 'Playfair Display', serif; font-size: 20px; font-weight: 400;}

     Co my tutaj mamy? Tak jak powiedziałam i tak jak widać po kolorze, wszystko możemy zmienić. Text-transform jest odpowiedzialne za wielkie litery, padding - za odstęp między literami i granicami tła oraz odstępem między poszczególnymi stronami, font-family to po prostu nasza czcionka, font-size - rozmiar, a font-weight decyduje, czy będzie to czcionka cienka czy pogrubiona, itp. Jak to wszystko powinno wyglądać? Ano tak:

     Przed sekundką załatwiliśmy linki, które widzimy cały czas oraz linki odwiedzone. Czemu te dwa selektory są po przecinku i czemu proponuję, by tak robić? Otóż, w tym momencie nasze polecenia odnoszą się do tego i tego, dzięki czemu nasze strony są cały czas takie same, przez co ładne i estetyczne. A teraz zajrzyjmy do aktywnej strony.

#PageList1 li.selected a {color: #000; background: transparent}
     Tutaj również pełna dowolność. Możemy dodać tło zamiast transparent, zmienić kolor czcionki, dodać efekt, pochylenie, pogrubienie, jakiś border. Decyzja należy do Was :)

#PageList1 li a:hover {color: #fff; background: #000; transition:all 0.5s; -moz-transition:all 0.5s; -webkit-transition:all 0.5s; -o-transition:all 0.5s}
     A teraz przed nami hover, czyli najechanie na link i związane z tym wariacje. Oczywiście, możemy tego w ogóle nie dodawać i nie będzie żadnego efektu. Ale kto nam broni? Kolor oraz tło możemy jak najbardziej zmienić. Dodać efekty, i tak dalej - co komu w duszy gra. O co chodzi z transition i dlaczego radzę Wam tego nie ruszać? Jeśli tego nie będzie, a kolor tła i czcionki będzie inny niż w a:link, to przejście będzie natychmiastowe. Transition i dobrane tutaj parametry (które można zmienić) sprawiają, że przejście z koloru w kolor, efektu w efekt jest bardziej płynne i delikatniejsze. Chyba fajnie, nie?
     I wygląda na to, że podstawowy CSS na nasze menu jest skończony.

Efekt


     To by było na tyle, jeśli chodzi o takie menu. Do tego można dodać social icons, na co instrukcję znajdziecie tutaj. Jaka różnica w tej instrukcji a w ikonach, które pasują tutaj? Zwykle ikony wsadzamy w prawy kąt i wtedy też przydaje się position: fixed oraz z-index większy od z-index, który przypisaliśmy dla #PageList1. Chyba najważniejsza rzecz. Sprawdźcie, jak Wam to wyjdzie i dawajcie znać :)


Pozdrawiam,
wanilijowa

Monday, July 14, 2014

The Lifetime of adventure




The lifetime of adventure
dodany: 14 lipca 2014
Autor: Tyler
Baza: Szablon Simple;
Przed pobraniem należy zapoznać się z regulaminem podanym poniżej;


Pobierz (hostuje.net)

Informacje techniczne
Jak wyżej napisałam, polecam skorzystanie z opcji "opis bloga" - tekst pod "Lifetime of Adventure" to właśnie opis - jeśli mielibyście ochotę stworzyć coś podobnego na Waszym blogu to pamiętajcie, że pole tekstowe "opisu" toleruje znaki HTML tj. chcąc zrobić enter, nie róbcie enteru tylko wpiszcie <br/>

Zmiana obrazku w nagłówku
Obrazek w nagłówku jest wpisany w kodzie CSS, dlatego też należy posłużyć się odpowiednim kodem, aby go zmienić. Aby w miejscu nagłówka ujrzeć własne zdjęcie/obrazek należy:
Wpisać w (szablon>dostosuj>zaawansowane) dodaj arkusz CSS kod:
#Header1 {background:url(adres url obrazka/zdjęcia );}

Gadżet "o blogu" + linki
Tutaj procedura już niemalże standardowa.
<center><div class='photo1'><img src='http://31.media.tumblr.com/9b9a51b4ccaaee57e4b2a0f33822070e/tumblr_mezr0oN8Qb1rtqkgno1_500.jpg'/></div></center>
Morbi viverra justo sit amet magna viverra quis mattis massa aliquet. Suspendisse dapibus dictum nulla, sit amet cursus odio accumsan vel. Duis id dui ante, ut volutpat enim. <br/>
<a class="nav" href="http://graphical-thoughts.blogspot.com/">Link 1</a>
<a class="nav" href="http://graphical-thoughts.blogspot.com/">Link 2</a>
<a class="nav" href="http://graphical-thoughts.blogspot.com/">Link 3</a>
<a class="nav" href="http://graphical-thoughts.blogspot.com/">Obserwuj</a>

Powyżej widzicie kod w gadżecie HTML/JavaScript. Poleca się utworzenie podobnego gadżetu na Waszym blogu, jednak nie jest to konieczne. Jednak jak ktoś się zdecyduje to:
Tekst niebieski - zamieniacie na adres url obrazka, któy chcielibyście, aby znalazł się w kolumnie.
Tekst fioletowy - jest to miejsce na opis Waszego bloga
Tekst czerwony - adresy/odnośniki do linków
Tekst zielony - opisy/nazwy linków

Regulamin
1.Pobierając szablon zostaw krótką informacje - pod najnowszym postem, podając nazwę szablonu i adres Twojego bloga.
2. Pobrany szablon jest tylko do użytku własnego.
3. Zmiany w szablonie są dopuszczalne, jednak przy tychże zmianach, niech Ci ręka nie lata i przypadkiem nie usunie creditu autorki.
4. Jeśli masz problem z pobranym szablonem, opisz problem w komentarzach ( polecana opcja, dzięki temu rozwiązanie problemu będzie dostępne dla wszystkich pobierających ), w mailu lub w tagboardzie.
5.Ciekawi Cię efekt w szablonie? W takim wypadku nie ściągaj go i nie grzeb w kodzie, a po prostu napisz, a z uśmiechem na ustach wyjaśnie cóż to takiego.



Jako, że długo ode mnie szablonu nie było, postanowiłam, że hasła na niego nie będzie. Jednak liczę, że raczej obejdzie się bez zbędnych spięć i innych takich dziwnych, niepotrzebnych rzeczy. :)
btw. Przepraszam za podgląd - ale ostatnio roamuje między jednym komputerem a drugim i jakoś tak wyszło :P

Friday, July 4, 2014

Przejrzysty szablon - co tak, a co nie?

     W sieci oraz ogólnie mediach minimalizm był modny tak naprawdę od zawsze, choć nie zawsze o tym wiedzieliśmy albo inaczej to postrzegaliśmy. Kiedyś, jak byliśmy młodsi, raczej nie zawracaliśmy sobie głowy tym, ile ramek powinien mieć nasz szablon, jakie tło, jakie czcionki, tylko wrzucaliśmy wszystko, co popadnie i co nam na myśl przyjdzie, byleby tylko było wszystkiego pełno, kolorowo i ... wiemy, o co chodzi! Pamiętam, jak sama miałam cały niebieski blog, jakiś obrazkowy nagłówek nie na wymiar i dziesiątki ramek z beznadziejnym tekstem i kolejnymi obrazkami - klasyka! Niektórzy byli na tyle sprytni, że wykręcali się stwierdzeniem, że "nie ocenia się książki po okładce". W sumie prawda, treść zawsze była ważniejsza, ale po co torturować oczy?

     Przypominam, że ten post jest jedynie moimi wskazówkami, dlatego możecie się nim sugerować w mniejszym lub większym stopniu. Przy okazji wyjaśnię, czemu w swoich szablonach daję tak mało ramek - wcale nie z lenistwa (tylko z wygody; przyjemne łączmy z pożytecznym, mówią...), ale dla estetyki. Got it?


     Krok pierwszy: Co ja w ogóle piszę? /co ja paczę?/
     Przed projektowaniem szablonu lub nawet całego bloga zastanówmy się, jakiej kategorii będzie nasza strona. Od tego będzie później zależeć, co nam jest tak naprawdę potrzebne. Opowiadanie, pamiętnik, blog modowy, kosmetyczny, lifestyle... - każdy z nich powinien skupić uwagę czytelnika na czymś innym.

     Przykładowo - blog z opowiadaniem powinien odwiedzającego z miejsca powalić na kolana nagłówkiem (z umiarem, kochani!), który od razu powie mu, o czym jest opowiadanie. Jeśli szukał akurat tego, na pewno zawiesi oko, a jak nie - przynajmniej nie zostawi SPAMu, tylko od razu sobie pójdzie. Potem post - najważniejsza część tego typu strony, stąd ważnym jest, by czytało się wygodnie. Czcionka musi się wyraźnie odróżniać na tle posta, ale hej, nie chodzi mi o neonowe kolory. Przypomnijcie sobie książki i autoryzowane strony internetowe - albo białe tło i czarne czcionki, albo na odwrót. Nigdy zielone tło i jasnozielona czcionka, migreny i leczenie ślepoty gwarantowane.

     Myślimy więc, co nas samych zaciekawiłoby w danym blogu i tak wszystko ustawiamy, jak puzzle!


     KROK drugi - czego potrzebuję?
     Okej, skoro jesteśmy już tutaj, to wiemy, o czym piszemy, jest dobrze. Takim standardem - według mnie - jest nagłówek (czy to w postaci grafiki czy samego napisu), nawigacja (czyli menu. W różnej formie - mogą to być strony, może to być menu w kolumnie, jak kto woli), obserwatorzy oraz ramka HTML/Java. Z zaledwie tymi czterema gadżetami przeciętny blog może śmigać, jak szalony.

     Co jeśli nasz blog nie jest "przeciętny?"
     Zawsze wygodną opcją jest HTML/Java, bo tam nieraz wystarczy tylko jeden gadżet, by dodać linki, button, informacje... co dusza zapragnie. Dzięki temu nie mamy nawalone wszystkie w układzie, jest porządek.
     Popularne posty są w porządku. Statystyka, gdzieś na górze/dole/z boku ikonki społecznościowe, jak najbardziej. Jeśli prowadzimy bloga lifestyle'owego, z dodatkami, z grafiką i tak dalej - na pewno przydadzą nam się kategorie zwane etykietami. Możemy dodać też archiwum. Niedawno Blogger wprowadził fajną opcje, gdzie archiwum jest w formie jednej listy - zajmuje mało miejsca, wygląda dość profesjonalnie i po prostu fajnie!

     *Jeśli piszesz opowiadanie, możesz dołożyć dodatkowo listę rozdziałów. Grant ma w swoim szablonie na dwa sposoby, a i tak jest to bardzo przejrzyste i przystępne dla oka. 1) Jako rozwijane menu z linkami, 2) Odnośnik do spisu rozdziałów w nawigacji całego bloga.


Gadżety takie jak lista blogów, lista linków tak naprawdę bym sobie darowała. Właściwie kogo interesuje, jakie blogi obserwuję? Jeśli chodzi o linki same w sobie - jak najbardziej, ale po co na głównej stronie? Możemy je wrzucić w menu pt. "llinki/sznureczki/sieciowe/" :)


     KROK trzeci - Gdzie&jak ułożę, żeby się nie przewróciło?
     Okej, w tym momencie powinniśmy wiedzieć, o czym będzie nasz blog i za pomocą jakich gadżetów/części strony powinniśmy zainteresować czytelnika, a więc co powinno się rzucić w oczy jako pierwsze. Układy, jakie oferuje nam Blogger nie są może jakoś wyjątkowo zróżnicowane, ale z pomocą kodów da się z nimi zdziałać cuda!
     Tutaj należy się zastanowić, co w tych wszystkich gadżetach jest najważniejsze, a co też ważne, ale już znacznie mniej? Podpowiem, że fajnym rozwiązaniem jest stopka bloga - jeśli blog jest w jasnych odcieniach, stopkę możemy dać ciemniejszą i opcjonalnie na całą szerokość bloga, przez co optycznie stworzymy tak jakby drugą, oddzielną część. Tam możemy dodać obserwatorów, ramkę z facebooka, jeśli ją mamy, jakieś buttony portali lub katalogów, które domagają się figurowania na głównej stronie, a nam wcale nie jest to w smak.
     W taki sposób poradziła sobie Tyler w zamówieniu dla Złodziejki Książek. To, co najważniejsze w blogu, to recenzje, więc jedna kolumna, a tam wpisy. Pod spodem wszystko inne, co zostało dodane na bloga, tj. etykiety, statystyki, obserwatorzy. Dlaczego to jest dobrym rozwiązaniem? Bo czytelnik ma przed oczami tylko to, co jest najbardziej istotne, a czytając post, i tak doscrolluje się na dół bloga, a więc do stopki i niczego nie przegapi.
     (+) Poza tym, powiedzmy, że takie oddzielenie stopki jest w modzie (: 



     Podsumowując...
     Co zawsze robię ja, kiedy robię szablon? Biorę kartkę A4, ołówek i rysuję - wtedy czarno na białym widać, czy zapaćkasz swojego bloga niepotrzebnymi gadżetami, czy też nie.

  • Tworząc swój szablon, myśl jak własny czytelnik - co najbardziej by Cię zainteresowało? I daj to w centrum bloga!
  • Pamiętaj o zasadzie "im mniej, tym lepiej". Naprawdę lepszym rozwiązaniem jest bardziej rozbudowane menu, niż 5 różnych, niepotrzebnych de facto gadżetów, dwa profile autora z jego zdjęciem i informacją, że lubi czekoladę, galeria zdjęć, gdy był młodszy i bawił się ze swoim psem... i tak dalej. Wyobraź sobie ubrać się na cebulkę w 30stopniowy upał.
  • Tworząc kod postów, pamiętaj nie tylko o własnej wygodzie, ale również o wygodzie czytelnika. Zapewniam Cię, że ten, widząc żółtą czcionkę Times new Roman 8px, wyjdzie od razu z bloga, nie kwapiąc się o informację, o czym to w ogóle jest. I wcale nie powinniśmy przesadzać w drugą stronę - Arial 20 też nie jest dobrym rozwiązaniem (:
  • Jeśli jednak uprzesz się na więcej gadżetów... w porządku! Ale w takim razie pamiętaj o odstępach między nimi, żeby jedno nie zlewało się z drugim (: 

Tuesday, June 24, 2014

Pomoc techniczna

Dzień dobry wszystkim!
Przybywam do Was w wolnej chwili, chcąc dać garść informacji i podyskutować na temat pomocy technicznej, która zastąpi(ła?) zamówienia. 
Tak czy siak, Tyler od teraz będzie Waszym własnym supportem.

Na sam początek może krótko o tym, dlaczego zdecydowałam się nie przyjmować więcej zamówień.
Otóż Tyler nie do końca tak naprawdę umie je robić. Poważnie. Przez to schodzi mi z tym tak dużo. Często prosicie o szablony, które kompletnie odbiegają od tych, które robię na GT i ciężko mi jest się przestawić i wykonać to o co poprosicie. Jak wiecie kocham "Ariala 11px" i czasem nie umiem użyć innej czcionki. Takie zboczenie, z którym nie do końca umiem sobie poradzić. Na pewno oddawałabym  więcej zamówień, gdybym może troszkę odpuściła i nie chciała zmieniać najgłupszego szczegółu. Oj, taka już jestem i mam nadzieję, że zrozumiecie moją decyzję.

Skoro częściowo poradziłam sobie w poprzednim pytaniem, teraz czas pogadać o tym, czemu akurat "pomoc techniczna".
To, że grafiki robić nie umiem wie większość z Was. I tutaj pojawia się nieco szansy, dla tych którzy grafikę lubią, a gorzej radzą sobie z CSS'em i HTML'em. Dużo łatwiej i szybciej dam radę pomagać Wam w tych kwestiach, zamiast próbować robić szablon. W związku z tym, jest cień szansy, że uda się pomóc nie jednej czy dwóm osobom, a dziesięciu. A to już coś.

Oks, no to teraz w jakich sprawach do mnie pisać.
We wszystkich. Poważnie. Chętnie pomogę ( właściwie to już pomagam ) w spięciach z post-headerem czy jednym gadżetem jak i w stworzeniu szablonu od podstaw.

Co zrobić, aby zacząć współpracę z "sup" Tyler.
Napisać e-mail. Nie ask.fm, nie komentarz, nie tagboard - email, gdzie dacie radę dokładnie opisać problem czy pomysł. Sounds legit, right? 
Ponadto w e-mailu najlepiej byłoby umieścić swój nick, adres bloga, opisać wszystko ( problem, pomysł, szablon, część szablonu ), a nawet dodać odpowiedniego screena, który na pewno by się przydał. Wypadałoby też zaobserwować GT i napisać hasło ( które nie zmienia się ). 

To by było w sumie na tyle, jakby ktoś miał jakieś pytania czy uwagi, piszcie pod tym postem, aby ta "pomoc techniczna" się jakoś trzymała i była pomocna dla wielu. :)
Teraz Tyler leci i wraca najpewniej wieczorem. 
Miłego dnia!
»