062. Well I still have faith... ~ ikony, tekstury, nagłówki, instrukcja CSS - menu

Emarosa - A Toast To The Future Kids!

Witajcie! Od razu muszę Wam powiedzieć, że sesja mnie goni. Zostały mi ostatnie dwa egzaminy, jednak są one najważniejsze, bo najtrudniejsze, dlatego w tym tygodniu znów nie będzie szablonów. Przepraszam w szczególności Race i obiecuję Ci, że za tydzień szablon otrzymasz, gdyż za tydzień rozpoczynam oficjalnie swoje ferie zimowe (jeśli wszystko zdam, ale to moja piąta sesja i jeszcze się nie zdarzyło, żebym nie zdała:p).
Przygotowałam za to ikony (1000 lat ich nie robiłam i nie wiem, czy Wam się spodobają - za każdym razem jak na nie patrzę to utwierdzam się w przekonaniu, że są... śmieciowe:p), nagłówki, kolejną paczkę teksturek i niespodziankę! Instrukcję CSS na menu z szablonu 66. Wierzę, że menu to przypadło Wam do gustu. Złośliwych uprzedzam - nie, nie znajdziecie tego na żadnej zagranicznej stronie.
Mam kilka pytań do pobierających szablony. Czy galeria jest według Was dobrze zrobiona? Czego brakuje Wam tam najbardziej? Wciąż otwieram Photoshopa z zamiarem stworzenia nowych szablonów i kończy się to klęską. Nie wiem, jakie szablony mam tworzyć. I nie chodzi tylko o tematykę i brak zdjęć, które chcielibyście ujrzeć na szablonach (nigdy nie wiem, które zdjęcie danego aktora będzie Wam najlepiej pasowało na Jamesa Pottera, na niektórych naprawdę do Jamesa dany aktor podobny nie jest;/), bo to można rozwiązać obowiązkiem nadsyłania mi kompletu zdjęć. Chodzi też o to, że nie wiem, czy wolicie klasyczne szablony (układ zamknięty i zwyczajna kolumna, proste menu lub: układ otwarty, zwyczajna kolumna lub dwie, proste menu), czy wolicie bajery po najechaniu, nowe układy, itd. W związku z tym wymyśliłam, że szablony tematyczne (HP, Igrzyska śmierci, Dary Anioła, itd. - wszystko, co tak jakby zamówicie w ramach propozycji) będę wykonywała jako klasyczne chyba, że osoba składająca propozycję zażyczy sobie inaczej - wtedy niech mi wskaże przykład z galerii, wg którego mam wykonać szablon (można wskazać układ lub menu - to od Was zależy, co Wam się podoba to wskażecie i tyle). Natomiast nowe rzeczy i moje eksperymenty powiedzmy będę wykonywała w formie szablonów minimalistycznych i tych z prostymi artami, czyli w formie takich, które może się komuś przydadzą, a może będą leżeć w galerii bezużytecznie. Inaczej się tego chyba zrobić nie da. Na pewno jest to lepsze od tego, jak jest teraz. A teraz wygląda to tak, że tych najnowszych szablonów nikt prawie nie pobiera, w każdym razie stare szablony, zwłaszcza nr 42 i 43 były pobrane ponad 400 razy i po prostu czuję, że kiedyś moje szablony bardziej do Was trafiały, częściej były pobierane. Chcę wiedzieć, co robię źle i mam nadzieję, że mi w tym pomożecie:) Za dużo kombinuję, prawda? Za dużo bajerów, wysuwanych elementów? Chcielibyście proste, klasyczne szablony? Piszcie.

 

   

 Z ostatniego powstanie szablon klasyczny, na za tydzień:p

I  N  S  T  R  U  K  C  J  A    C  S  S   -   M  E  N  U

MENU

Główna O mnie O blogu galeria

linki moje Dodatki Wyjście

• KLIKNIJ, ABY PRZECZYTAĆ INSTRUKCJĘ
  
  Dodaj ramkę HTML/JavaScript. Wklej do ramki poniższy kod:
  

  <div class="terr">
  <div class="terrk">
  <div class="terr2">
  MENU</div>
  <div class="kol1">
  <a href="http://linkdostrony.pl/">Główna</a>
  <a href="http://linkdostrony.pl/">O mnie</a>
  <a href="http://linkdostrony.pl/">O blogu</a>
  <a href="http://linkdostrony.pl/">galeria</a>
  </div>
  <div class="kol2">
  <a href="http://linkdostrony.pl/">linki</a>
  <a href="http://linkdostrony.pl/">moje</a>
  <a href="http://linkdostrony.pl/">Dodatki</a>
  <a href="http://linkdostrony.pl/">Wyjście</a>
  </div>
  </div>
  </div>

  
  Za wszystkie różowe fragmenty podstawiacie swoje hasła. Za Menu możecie wstawić wszystko. Za http://linkdostrony.pl/ wstawiacie swój link do danej strony, natomiast za Główna, O mnie itd. wstawiacie swoje tytuły linków w menu (nazwy wyświetlane).
  Przejdź do Szablon > Dostosuj > Zaawansowane > Dodaj arkusz CSS. Wklej poniższy kod:
  

  .terr {
  z-index:20;
  width:74px;
  height:74px;
  border-radius:100px;
  }
  .terr2 {
  width:45px;
  padding: 30px 7px 30px 22px;
  transition: all 1s ease-in-out;-o-transition: all 1s ease-in-out;-webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;
  border-radius:100px;
  background:#1b2a57 /*KOLOR KÓŁKA*/;
  color:#8092c5 /*KOLOR CZCIONKI W KÓŁKU*/;
  }
  .terr2:hover {
  background:#1c7e7f /*KOLOR KÓŁKA PO NAJECHANIU*/;
  color:#fff /*KOLOR CZCIONKI W KÓŁKU PO NAJECHANIU*/;
  cursor:pointer;
  transition: all 1s ease-in-out;-o-transition: all 1s ease-in-out;-webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;
  }
  .terrk {
  width:74px;
  height:74px;
  }
  .terrk .terr2 {
  transition: all 1s ease-in-out;-o-transition: all 1s ease-in-out;-webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;
  transform: rotate(0deg); -o-transform:rotate(0deg) ;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);
  }
  .terrk:hover .terr2 {
  background:#1c7e7f /*KOLOR KÓŁKA PO NAJECHANIU*/;
  color:#fff /*KOLOR CZCIONKI W KÓŁKU PO NAJECHANIU*/;
  transition: all 1s ease-in-out;-o-transition: all 1s ease-in-out;-webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;
  transform: rotate(360deg); -o-transform:rotate(360deg) ;-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg); }
  .terr .kol1 {
  transition: all 1s ease-in-out;-o-transition: all 1s ease-in-out;-webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;
  opacity:0;
  position:relative;
  left:-150px;
  }
  .terr .kol2 {
  transition: all 1s ease-in-out;-o-transition: all 1s ease-in-out;-webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;
  opacity:0;
  position:relative;
  left:140px;
  }
  .terr:hover .kol1 {
  transition: all 1s ease-in-out;-o-transition: all 1s ease-in-out;-webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;
  left:-100px;
  opacity:1;
  }
  .terr:hover .kol2 {
  transition: all 1s ease-in-out;-o-transition: all 1s ease-in-out;-webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;
  left:90px;
  opacity:1;
  }
  .kol1 {
  position:relative;
  top:-90px;
  }
  .kol2 {
  position:relative;
  top:-190px;
  }
  .kol1 a:link, .kol1 a:visited, .kol2 a:link, .kol2 a:visited /*STYL LINKÓW*/ {
  font-size:10px;
  font-family:'Arial',sans-serif;
  display:block;
  margin:2px;
  background:#000 /*KOLOR TLA LINKÓW*/;
  text-transform:uppercase;
  color:#fff !important /*KOLOR CZCIONKI LINKÓW*/;
  text-align:center;
  padding:5px;
  width:70px;
  transition: all 1s ease-in-out;-o-transition: all 1s ease-in-out;-webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;
  }
  .kol1 a:hover, .kol2 a:hover {
  transition: all 1s ease-in-out;-o-transition: all 1s ease-in-out;-webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;
  background:#1c7e7f /*KOLOR TŁA LINKÓW PO NAJECHANIU*/;
  color:#fff /*KOLOR CZCIONKI LINKÓW PO NAJECHANIU*/;
  text-decoration:none;
  }

  
  Kolory poszczególnych elementów macie omówione w każdym selektorze:) Jeśli ktoś nie zna się za bardzo na CSS'ie to radzę nie kombinować ze zmianą wartości cech: width, padding, height, gdyż może to spowodować, że linki zaczną się pojawiać już po najechaniu na przestrzeń pod kółeczkiem (kod jest napisany tak, żeby tak się nie działo:p).

Jeśli korzystasz z instrukcji na swoim blogu, NAPISZ, ŻE MENU ZOSTAŁO WYKONANE NA PODSTAWIE TEJ INSTRUKCJI (informacja ta powinna być jednocześnie linkiem do mojego bloga). Jeśli wykorzystujesz instrukcję do stworzenia szablonu wolnego/zamówienia również umieszczaj taką informację. To chyba nie jest jakoś mega wyczerpujące zajęcie, a mi napisanie tej instrukcji trochę czasu zajęło, więc będę wdzięczna:)

PILNIE POTRZEBUJĘ DOBREGO HOSTINGU!
Imageshack oszalał, wprowadzili obowiązkowe opłaty, za 16 dni zablokują mi konto (wtedy skończy się darmowy trial). Nie podoba mi się to, jak postąpili, bo jestem ich użytkownikiem od wielu lat, ale oni mają to gdzieś. Nie zamierzam jednak płacić ponad 70zł za to, żeby móc wrzucić Wam tutaj grafikę. Czy ktoś może mi polecić jakiś dobry hosting? Przeniosłam się na funkyimg.com, jednak nic o nim nie wiem:< Czy jest to dobra strona? Usuwają zdjęcia, jak ma się konto? Pomóżcie!

Nie wiem, co za tydzień. Macie jakieś pomysły?:)

xoxo;*

10.02.2014, 22:07
Przepraszam za wszystkie opóźnienia. Odpisałam już na część wiadomości, ale to wciąż mało. Mój kot (Owieczka, pamiętacie Owieczkę?) stracił nogę i musiałam się nim zająć. W ogóle nie byłam w stanie myśleć o blogu po tym, co zobaczyłam w niedzielę rano i po tym, co wydarzyło się wcześniej... Na szczęście wszystko już jest dobrze, dlatego się odzywam:) Opowiem Wam wszystko w najnowszym poście, w którym również dowiecie się o szczegółach składania u mnie zamówień. Tak, dobrze słyszycie, zamówienia wracają:) No i w następnym poście pojawi się troszkę szablonów. Kiedy - nie wiem. Zaczynam tworzyć od jutra:) Ale z pewnością post pojawi się do czwartku, gdyż w piątek mnie nie będzie:) Buziaki!

13.02.2014, 21:10
Post w sobotę. Camtasia Studio 8 dalej nie pozwala mi tworzyć animacji:( Są tak wolne, że cierpliwości mi do tego wszystkiego brakuje... Beznadzieja. Do soboty to rozkminię.