Małgolinki - podsumowanie czerwca + wasze linki

30 czerwca 2016


Mamy podsumowanie czerwca - szybko mi to zleciało, ale od początku. Czerwiec nie był dla mnie najlepszym miesiącem. Zakończenie roku przeglądem, ostatnie warsztaty, nasilenie się alergii, zmiana alergologa. Właśnie zmiana alergologa. Wiecie czasem nam zapala się taka kontrolka, że coś jest nie tak. W moim wypadku również tak było, kiedy alergolog nie chciał mi zlecić dodatkowych badań. Zmieniłam lekarza i co się okazało? Miałam dobrane złe leczenie i wyszła mi astma sezonowa, więc czerwiec nie był zbyt ciekawym miesiącem. Tak to wyglądało u mnie. W komentarzach piszcie jaki czerwiec był u Was, a teraz czas na linki :) 

  1. Zbiór darmowych ikon (wektory) 
  2. Jesteście ciekawi nowości typograficznych? Ta strona pokaże Wam wszystko co aktualnie pachnie świeżością. [ENG]
  3. Mockup MacBook Pro - 15 Mockupów z różnymi ułożeniami MacBooka do pobrania za darmo. 
  4. Photl - darmowy bank zdjęć 
  5. Darmowe pędzle do Photoshopa
  6. Kolejna strona z darmowymi pędzlami do Photoshopa
  7.  Justyna na swoim blogu, opublikowała ciekawą listę stron dla artystów i nie tylko. Interesujesz się rysunkiem, ale nie wiesz jak coś na rysować? No, to co tu jeszcze robisz? Leć na bloga Justyny zobaczyć jej listę przydatnych stron. 
Czerwiec marny w linkach, ale mam nadzieję, że Wy uzupełnicie tą listę swoimi linkami, bo po raz pierwszy na blogu pojawiła się opcja dodania swojego najciekawszego wpisu z danego miesiąca! Pokaż innym (oraz i mi) swój tekst, z którego jesteś najbardziej dumny! 

Jednak za nim do tego dojdziemy, kolejna część podsumowania czyli ostatnio na blogu i statystyka. 

Ostatnio na blogu 



Wasze linki


kliknij "Add your link"

Czytaj dalej »

Jak zrobić gradient za pomocą CSS

28 czerwca 2016


Chyba każdy z Was wie co to jest gradient i wie jak wygląda. Dla tych co nie wiedzą - to nic innego jak płynne przejście między dwoma kolorami. Niektórzy nazywają to efektem ombre (podobno ładniej brzmi). W dzisiejszym wpisie pokaże Wam jak zrobić gradient za pomocą kodu CSS na naszym blogu.

Jedynce co będziemy musieli zrobić to przejść do:

szablon - dostosuj - zaawansowane - dodaj arkusz CSS 

LISTA SELEKTORÓW

Ramka z gradientem (ombre) 


Żeby stworzyć ramkę z gradientem potrzebny nam będzie taki kod:

.selektor {
    width: 250px;
    height: 20px;
text-align: center;
text-transform: uppercase;
padding: 10px;
    background: #fff;
    border: 10px solid transparent;
    -moz-border-image: -moz-linear-gradient(top, #dcd2e3  0%, #9581a1 100%);
    -webkit-border-image: -webkit-linear-gradient(top, #dcd2e3 0%, #9581a1 100%);
    border-image: linear-gradient(to bottom, #dcd2e3 0%, #9581a1 100%);
    border-image-slice: 1;
}
Szerokość 
Wysokość 
Położenie tekstu
Wygląd tekstu (tutaj ustawione na drukowane)
Marginesy wewnętrzne 
Kolor tła
Grubość obramowania 

Wszystkie pogrubione wartości są zmienne. To co na czerwono to kolor pierwszy, naszego gradientu.

W moim wypadku zastosowałam ten kod do tytułów gadżetów, więc prezentuje się on tak:

.sidebar h2 {
    width: 250px;
    height: 20px;
text-align: center;
text-transform: uppercase;
padding: 10px;
    background: #fff;
    border: 10px solid transparent;
    -moz-border-image: -moz-linear-gradient(top, #dcd2e3  0%, #9581a1 100%);
    -webkit-border-image: -webkit-linear-gradient(top, #dcd2e3 0%, #9581a1 100%);
    border-image: linear-gradient(to bottom, #dcd2e3 0%, #9581a1 100%);
    border-image-slice: 1;
}

Efekt: 


No dobrze, wiemy już jak zrobić ramkę z gradientem, a jak zrobić tło? To nic trudnego! Musimy po prostu dodać taki kod:

.selektor {
text-transform: uppercase;
text-align: center;
letter-spacing: 2px;
font-color: #fff;
padding: 10px;
    background: #fff;
    background: -webkit-linear-gradient(#dcd2e3, #9581a1);
    background: -o-linear-gradient(#dcd2e3, #9581a1);
    background: -moz-linear-gradient(#dcd2e3, #9581a1);
    background: linear-gradient(#dcd2e3, #9581a1);
}

Wygląd tekstu
Położenie tekstu
Odstęp między literami
Kolor czcionki
Wewnętrzne marginesy 

Wszystkie pogrubione wartości są zmienne. To co na czerwono, to kolor pierwszy naszego gradientu.

W moim wypadku, znowu zastosowałam ten kod, dla tytułów gadżetów i wygląda on tak:

.sidebar h2 {
text-transform: uppercase;
text-align: center;
letter-spacing: 2px;
fony-color: #fff;
padding: 10px;
    background: #fff;
    background: -webkit-linear-gradient(#dcd2e3, #9581a1);
    background: -o-linear-gradient(#dcd2e3, #9581a1);
    background: -moz-linear-gradient(#dcd2e3, #9581a1);
    background: linear-gradient(#dcd2e3, #9581a1);
}

Efekt: 


Jak możecie zauważyć, części odpowiadające za gradient w pierwszym i drugim kodzie są takie:

background: #fff;
    border: 10px solid transparent;
    -moz-border-image: -moz-linear-gradient(top, #dcd2e3  0%, #9581a1 100%);
    -webkit-border-image: -webkit-linear-gradient(top, #dcd2e3 0%, #9581a1 100%);
    border-image: linear-gradient(to bottom, #dcd2e3 0%, #9581a1 100%);
    border-image-slice: 1;


oraz

 background: #fff;
    background: -webkit-linear-gradient(#dcd2e3, #9581a1);
    background: -o-linear-gradient(#dcd2e3, #9581a1);
    background: -moz-linear-gradient(#dcd2e3, #9581a1);
    background: linear-gradient(#dcd2e3, #9581a1); 

Jak możecie zauważyć - w jednym oraz w drugim kodzie zapisaliśmy po prostu dwa wybrane kolory przy background, które się "zatarły" - innej magii w tym nie ma. Proste prawda? ;)
Czytaj dalej »

Adobe Illustrator część pierwsza - podstawy, poznajemy narzędzia

27 czerwca 2016


Na początek mała informacja - od poniedziałku (czyli od dzisiaj) wpisy prawdopodobnie będą pojawiać się codziennie, ponieważ muszę nadrobić ten stracony czas. W tym czasie pojawi się instrukcja na bloga, podsumowanie miesiąca oraz wpis o jeździectwie, ale trochę nietypowy i wiele, wiele więcej, a dzisiaj jak widzicie poznamy trochę Illustratora.

Co to jest Adobe Illustrator?
Program graficzny z rodziny Adobe do tworzenia grafiki wektorowej( czyli do tego co widnieje na głównym zdjęciu tego wpisu - tak, te komputerki to są wektory, ale o tym jaka jest różnica po między grafiką wektorową,  a bitmapową kiedy indziej). Podobne programy do Illustatora to CorelDraw (płatny tak samo jak Illustrator) oraz darmowy Inkscape.

Narzędzia programy Illustrator

Gdzie znaleźć okno narzędzi, jeśli nie pojawi nam się od razu po uruchomieniu programu?
Przechodzimy do okno - narzędzia.

 Narzędzie zaznaczania (V) - służy do zaznaczania całych obiektów.

 Narzędzie zaznaczania bezpośredniego (A) - dzięki niemu możemy zaznaczyć punkty/segmenty ścieżek obiektów. 

Jak widzicie przy białej strzałce mamy drugą, małą strzałkę w rogu. Po kliknięciu tej strzałki rozwinie nam się lista innych narzędzi i takim o to sposobem przy białej strzałce mamy jeszcze jedno narzędzie. 

 Narzędzie zaznaczania grupowego - dzięki temu możemy zaznaczyć obiekty lub grupy wewnątrz grup. 

 Różdżka (Y) - dzięki niej możemy zaznaczać obiekty.

 Lasso (Q) - dzięki niemu możemy zaznaczyć punkty i segmenty ścieżek wewnątrz obiektów. 

 Pióro (P) - dzięki temu narzędziu możemy rysować krzywe. 

 Narzędzie dodawania punktów kontrolnych (+) - dzięki temu narzędziu możemy dodać dodatkowe punkty do ścieżek. 

 Narzędzie usuwania punktów kontrolnych (-) - dzięki temu narzędziu możemy odejmować punkty kontrolne ze ścieżek.

 Narzędzie konwertowania punktów kontrolnych (Shift+C) - dzięki temu narzędziu możemy zmienić punkty ścieżki, które są ostre na okrągłe i okrągłe na ostre. 

 Narzędzie tekstu (T) - służy do wprowadzenia tekstu. 

 Narzędzie tekst akapitowy - dzięki niemu, możemy zamienić zamknięte ścieżki w ramki tekstowe czyli np. wewnątrz koła, serca etc. 

 Narzędzie tekstu na ścieżce - dzięki temu narzędziu, możemy zmienić ścieżki na ścieżki tzw. tekstowe, na których możemy wpisywać tekst. 

 Narzędzie tekstu pionowego -  dzięki niemu możemy tworzyć tekst pionowy. 

 Narzędzie tekstu pionowego akapitowego - dzięki temu narzędziu, możemy zmienić ścieżki na ścieżki tzw. tekstowe i wpisywać tekst pionowo. 

 Narzędzie tekstu pionowego na ścieżce - dzięki temu narzędziu możemy zamienić ścieżki na ścieżki tekstowe pionowe. 

 Narzędzie linia (\) - dzięki temu narzędziu możemy rysować proste linie 

 Narzędzie łuk - dzięki temu narzędziu możemy rysować wygięte linie. 

 Narzędzie spirala - dzięki temu narzędziu możemy rysować spiralę. 

 Narzędzie siatka prostokątna - narzędzie do rysowania siatki. 

 Narzędzie siatka biegunowa - rysuje siatki okrągłe. 

 Narzędzie prostokąta (M) - dzięki niemu możemy stworzyć prostokąt. 

 Narzędzie prostokąt zaokrąglony - dzięki niemu możemy stworzyć prostokąt z zaokrąglonymi rogami. 

 Narzędzie elipsa (L) - dzięki niemu możemy stworzyć elipsę. 

 Narzędzie wielokąta - dzięki niemu możemy stworzyć wielokąt. 

 Narzędzie gwiazda - dzięki niemu możemy narysować np. gwiazdkę lub trójkąt. 

 Narzędzie flara - dzięki niemu możemy stworzyć efekt rozbłysku. 

 Narzędzie pędzel (B) - narzędzie umożliwiające nam malowanie. 

 Narzędzie ołówek (N) - dzięki temu narzędziu możemy rysować krzywe. 

 Narzędzie gładzik - narzędzie wygładzania ścieżek czyli ostre krawędzie będą wygładzone. 

 Narzędzie gumka - dzięki niemu możemy usunąć ścieżki.

 Narzędzie kropla (Shift +B) - dzięki temu narzędziu możemy modyfikować ścieżki pędzla kaligraficznego, zmienia nam kształt po przez rozszerzanie i scalanie.

 Narzędzie gumka (Shift+E) - dzięki temu narzędziu możemy usunąć dowolny obszar naszej grafiki. 

 Narzędzie nożyczki (C) - dzięki temu narzędziu możemy ciąć ścieżki na punktach. 

 Narzędzie nóż - dzięki temu możemy ciąć grafikę (obiekt) oraz ścieżki. 

W tej części to tyle. W drugiej części reszta narzędzi z AI, ponieważ jakbym dziś zrobiła listę wszystkich narzędzi, to wpis by był zdecydowanie za długi. 
Czytaj dalej »

3 wakacyjne tapety na pulpit i telefon do pobrania za darmo

23 czerwca 2016


Wakacje już nadeszły, więc czas na wprowadzenie zmian na naszych pulpitach i telefonach. W dzisiejszym wpisie, przygotowałam dla Was w sumie 6 tapet do pobrania całkowicie za darmo. 3 rodzaje tapet na pulpit oraz telefon.


Informacje


  • Tapety pobierasz tylko i wyłącznie na swój własny użytek - nie można udostępniać ich dalej 
  • Grafiki, które widnieją na tapetach są mojego autorstwa 

Tapety na pulpit

Tapeta Summer Time 


Czytaj dalej »

Szablon Art blog do pobrania za darmo na Bloggera

17 czerwca 2016


Szablon Art blog to darmowy szablon na Bloggera. Jest utrzymany w kolorystyce filetu, żółci i mięty. Jest stworzony tak, abyś bez problemu mógł dostosować go do swoich potrzeb po przez zmianę koloru poszczególnych elementów, a nawet czcionek. Do szablonu jest dodana instrukcja, którą warto przeczytać - tam jest cały opis co, gdzie i jak. Szablon stworzony z myślą o tych osobach, które lubią mieć trochę koloru u siebie na stronie.

Info o szablonie


  • Szablon zawiera automatyczne skracanie wpisów 
  • W szablonie znajduje się funkcja automatycznego dopasowania zdjęć we wpisie oraz w rubryce "o mnie" w kolumnie bocznej. Dzięki temu możesz wstawiać zdjęcia w oryginalnym rozmiarze. Mniejsze zdjęcia we wpisie, zostaną tej samej wielkości. 
  • Menu na stronie to standardowe strony Bloggera 
  • Można zmienić kolory, czcionki, usuwać ikonki w kolumnie bocznej 
  • Dodana instrukcja instalacji 

Uwagi 

  • Szablon oraz grafiki dodawane do szablonu są tylko i wyłącznie na użytek własny. Udostępnianie szablonu osobom trzecim w postaci oryginalnej lub zmienionej jest zabronione
  • Szablon posiada nieusuwalną stopkę z podpisem autora. Po usunięciu jej, zostaniesz automatycznie przeniesiony na stronę blonparia.blogspot.com
  • Nie wolno modyfikować wyglądu stopki tzn. zmieniać jej koloru tak, aby nie była widoczna i podpisywać się pod szablonem jako autor 
  • W razie jakichkolwiek problemów/pytań napisz na maila blonparia@gmail.com
  • Nie proś osób trzecich o pomoc przy szablonie w razie powstania problemu - istnieje ryzyko, że dana osoba źle podejdzie do Waszego problemu, a wtedy szablon może zostać uszkodzony lub całkowicie zniknąć z bloga. Pamiętaj! Zawsze zwracaj się z prośbą o pomoc do autora szablonu 

To może Ci się przydać 





Chcesz indywidualny szablon?


Zawsze możesz zamówić szablon, jeśli te, które udostępniam do pobrania Ci nie odpowiadają. Wystarczy, że zajrzysz na stronę.


Pobierz Podgląd
Czytaj dalej »

Metamorfoza bloga W świecie Aleksandry

16 czerwca 2016


Pamiętacie jak wspomniałam o akcji "Metamorfozy blogów"? Było dużo głosów za, ale za bardzo nie miałam kiedy się za to zabrać. Ostatnio, oddałam jedno z paru zamówień, więc postanowiłam w końcu się zebrać w sobie i zrobić wpis z tej serii.

Szablon, który przeszedł metamorfozę znajduje się na blogu Oli. Poprzedni szablon nie był zły, ale Ola bardzo chciała, aby jej nowy wygląd bloga był połączeniem darmowego szablonu Laguna oraz Flora (które możecie cały czas pobierać). Również w zamówieniu pojawiła się prośba o nowy typograficzny nagłówek.


Zmiana nagłówka





Jak można zauważyć zmiana fontów w nagłówku wyszła jak najbardziej na + i pozbyliśmy się tego wielkiego A, które tak naprawdę trochę robiło nam zamieszanie.

Wygląd wpisów 



Jak widzicie pozbyliśmy się ramki wokół wpisu, datę wpisu i autora przenieśliśmy pod tytuł,  a czytaj więcej przestawiliśmy na prawą stronę. Pozbyliśmy się również etykiet ze stopki wpisu - krótko mówiąc, cały układ wpisu jest układem z szablonu Flora.


Kolumna boczna 




Jak widzicie w kolumnie bocznej zmieniliśmy obramowanie gadżetów na jedną, ciągłą kolumnę w odcieniu szarości, zmieniliśmy również tytuły gadżetów, ikony społecznościowe oraz wygląd popularnych postów. Całą kolumna boczna jest z szablonu Laguna.

Menu/ Strony 


Tutaj ciężko jest to pokazać, ale pozbyłyśmy się linii nad i pod stronami, zmieniłyśmy font oraz wykonałyśmy drobny zabieg tak jak w szablonie flora, czyli - menu "przykleja się" do górnej krawędzi bloga po scrollowaniu strony.


Cały szablon przed i po 



Mała informacja na koniec, żeby nie było wątpliwości - poprzedni szablon został całkowicie usunięty, nic nie było w nim zmieniane. 

Chcesz mieć nowy szablon? KLIKNIJ TUTAJ aby zamówić. 
Czytaj dalej »