środa, 20 sierpnia 2014

[01] Instrukcja -Minimalistyczny nagłówek gif z napisem na bloga bez Photoshopa.

Witajcie na wstępie chcę podziękować za tak miłe powitanie :3 (Wcale nie płakałam jak zobaczyłam tyle komentarzy i wejść, w c a l e) Dziękuję również katalogowi grafików za wystawienie mojego szablonu z pandą. -Widok mnie był bezcenny. Miotałam się po pokoju z piskiem i płaczem, cieszyłam się jak głupia. Nawet zadzwoniłam do przyjaciółki by jej o tym opowiedzieć- Po wielkich podziękowaniach..
Czas na 'koszmar drugiego postu' -Jak to rzekła KotCheshire- Siedziałam od tygodnia i zastanawiałam się co zrobić na tą notkę. Zamówień dzięki bogu nie dostałam -Za to zapomniałam napisać na IWCYIYF że nie zamykam zgłaszanie zamówień przez co teraz muszę zrobić 7 zamówień. Jedyne co teraz mogę zrobić to kopnąć się w twarz (ał) za moją sklerozę i zakasać rękawy i do roboty.- daliście mi za to wolną rękę. Za co dziękuję. I tak oto wiedząc że gigantyczna ilość szablonów nie wchodzi w grę. Postanowiłam zrobić instrukcję na minimalistyczny nagłówek gif z napisem który jest strasznie prosty. -Nie potrzeba PS- Jedyne co musicie mieć to gif który uwielbiacie i chcecie mieć z nim szablon , cytat i otwarty projektant szablonu bloggera :3 Tak więc nie piernicząc wam już zacznijmy od początku.


1.Bierzemy nasz gif. Najlepiej gdyby był rozdzielczości 500x200.

2.Linkujemy go na jakiejś stronie by polepszyć jakość i mieć krótszy link [polecam tu]

http://funkyimg.com/i/K4xb.gif

3. Jak już mamy nasz link, a mamy wcześnie przygotowany cytat (można go zrobić lub wybrać z paczki która jest u dołu strony) także go linkujemy. 

http://funkyimg.com/i/K4xa.png

4.Teraz otwieramy nową kartę (Broń ci boże zamknąć tą gdzie są linki!) wchodzimy w projektanta szablonów naszego bloga. W zakładkę Zaawansowane > Dodaj arkusz CSS

5.Wpisujemy sobie taki tam kodzik:
.header {  background-image:  url(link do cytatu),url(link do gifu);  background-repeat: no-repeat, no-repeat; margin:50px 0px 0px 150px !important;height:200px; width:500px; background-position: 0px 0px, 0px 0px; }
!PAMIĘTAJ! Nigdy nie dawaj cytatu jako drugiego linku. Gif ma zawsze być na drugim miejscu!

Wychodzi nam {takie coś} jak u mnie :
.header {  background-image:  url(http://funkyimg.com/i/K4xa.png),url(http://funkyimg.com/i/K4xb.gif);  background-repeat: no-repeat, no-repeat; margin:50px 0px 0px 150px !important;height:208px; width:500px; background-position: 25px 0px, 0px 0px;; }

6.Voilà nagłówek z gifem zrobiony. -Każdy z tych parametrów można zmienić według własnych upodobań :3

Jeśli zrobiłeś nagłówek wraz z gifem z tej instrukcji proszę o credycik w postaci dopisku:
Nagłówek robiony na podstawie instrukcji Luny
I jak instrukcja ? Jeśli macie jakiekolwiek problemy pisać w komentarzach a z chęcią udzielę pomocy :) Na sam koniec notki mam dla was 2 sygnaturki 1 szablon, paczkę tekstów na wasze nagłówki gify i jeden kod z gotowym nagłówkiem z gifem do wykończenia własnego. Na następne notki postaram się przygotować instrukcje na picmonkey jak ją obsługiwać i robić w niej prace graficzne :3 -Przepraszam za tak marny obrazek paczki ale zrobiłam go w pośpiechu. -Jutro zostanie zmieniony.





Pobierz

(naciśnij na paczkę by pobrać)

Jeśli wolimy coś bardziej {skromnego} można dać taki kodzik :

.header {  background-image:  url(http://funkyimg.com/i/K4qf.png),url(http://funkyimg.com/i/K4v4.gif);  background-repeat: no-repeat, no-repeat; margin:50px 0px 0px 150px !important;z-index: 77;height:208px; width:500px; background-position: 420px 80px, 0px 0px;; }



5 komentarzy:

  1. Instrukcja jest naprawdę ciekawa, może kiedyś będę mogła z niej skorzystać. Najpierw muszę umieć robić szablony ;) Jest to świetny pomysł, żeby nagłówek składał się z kilku "warstw", plus jeszcze ruchomy gif. Bajer do minimalistycznych. Pozdrawiam!

    OdpowiedzUsuń
  2. Świetna instrukcja ! komuś na pewno się przyda :D A początkującym na 100% z prac najbardziej podoba mi się 2 sygnaturka ^^ jest śliczna tylko strasznie dużo napisów tam dałaś i nie widać elementów przy modelce (ale i tak jest ona śliczna *O*) Pozdrawiam !

    OdpowiedzUsuń
  3. Przyjmujesz może zamówienia na szablony? x

    OdpowiedzUsuń
  4. Zapraszam do BAZY GRAFIKÓW - zapisz się i pokaż innym swojego bloga!
    Zapraszam również do współpracy oraz zgłaszania się do trwającego naboru. Więcej informacji na blogu - http://baza-grafikow.blogspot.com/

    Pozdrawiam

    OdpowiedzUsuń
  5. 1. http://why-are-you-doing-this-one-direction.blogspot.com
    2. nastka223@gmail.com
    3. Emily Rudd i Harego Stylesa
    4. Las, i nie wiem co jeszcze to jest Dark FF. :)
    5. but I'm not your princess.
    You'll meet her someday, but it's not me
    6. Czarno-białe, mroczne :)
    7. Otwarty :)) Wiem że przyjmujesz je rzadko ale proszę. :c
    hasło : Gone.

    Bardzo dziękuję i pozdrawiam! :)

    OdpowiedzUsuń

Graphic Luna
Dawniej graphic-catchers-illusion
Blog wraca już za niedługo!