Quaz:
Hi. Po nadzwyczaj długim okresie zastanawiania się, rozważania za i przeciw... Postanowiłem udostępnić Wam moje projekty stylu profilów. Poniżej znajdziecie uporządkowane kody, wraz z ogólnymi screenami i krótkimi opisami. Oprócz najważniejszego projektu - pozostałe mają swoją nazwę i numer wersji - ułożony chronologicznie według tego, kiedy utworzyłem kod. Czyli nietrudno się domyślić, że v1 jest mniej dopracowane od v5. Mimo to, ostatniej nocy spędziłem kilka godzin, starając się choć częściowo ujednolicić kod - na ile się dało.
Możecie zastanawiać się, dlaczego to robię. Przez dość długi czas wykonywałem i sprzedawałem kody, przerobione z mojego własnego. Niestety, przestało mi się to opłacać... Co zauważyłem po zakończeniu projektu Facebookowego. Po prostu w ciągu kilku godzin miała go połowa społeczności. Był zbyt mało "personalny" - przez co spodobał się wszystkim i nie minęło długo, zanim ktoś go nie ukradł. To smutne, że żerujecie na cudzej pracy. Naprawdę.
Zapraszam Was do małej galeryjki - and take whatever you want.
Vernon:
Cześć. Gadałem z Quazem ostatnio i mówił żebym to jakoś ruszył, by ludzie sobie to używali. Więc postanowiłem to odświeżyć - tak, za jego zgodą. Będą również nowości, jak mi się będzie chciało. Nie hejtujcie że niby ukradłem cały temat, jak wcześniej pisałem Adam zezwolił na to, więc chill, pomagałem mu z tym również. Miłego.
Temat z edycją kodu HTML!
https://net4game.com...ycja-kodu-html/
Jak wkleić kod? Tak.
Kliknij w to "Tak" żeby włączyć filmik instruktażowy.
Facebook-like
Najdoskonalszy jak dotąd projekt. Najoryginalniejszy. Jako pierwszy - ingerujący w szatę profilu, układ tabel. Jednocześnie pracowałem nad nim najdłużej i - jak na ironię - szło mi jak po maśle. Pod koniec otrzymałem pomoc od kilku osób - choć najbardziej pomógł Marzecki Rafał , za co serdecznie dziękuję.
Co ma w sobie "Facebook"? Przede wszystkim, brak tła obrazkowego - to zdecydowany plus dla osób o dziwnym zmyśle estetycznym. Jestem zmęczony profilami, które są nieczytelne przez nieodpowiedni dobór tła. Biały tekst na białym tle - seriously? Tutaj nie ma takiego problemu - bo jest mniejsze pole do personalizacji, większe ujednolicenie. I tak być powinno. Oprócz tego istotnego szczegółu, zmieniłem układ tabeli - to, co było po prawej, jest po lewej - i vice versa. Do tego główna tabela jest nieco węższa. To są najważniejsze cechy - reszta jest mniej istotnymi szczegółami.
Screenshot: http://i.imgur.com/knJuiGs.png
Kod: http://pastebin.com/MQnSyiCV
Glass (v1)
Projekt współtworzony z Venothem, powstał pod koniec 2011 roku - był tworzony na zamówienie. Jest bardzo prosty i całkiem nieźle wygląda z ciemnym tłem. Wiele rzeczy pozostało domyślnych, a kod jest odrobinę za długi (był tworzony pod stary layout forum, więc wiele rzeczy pozmieniało nazwy, przez co część kodu zwyczajnie nic nie robi). Odświeżyłem go na tyle, żeby nie było żadnych domyślnych kawałków (jak białe paski w postach, to obrzydliwe).
Screenshot: http://i.imgur.com/6IOPsdR.jpg
Kod: http://pastebin.com/C8uJ5sEz
Afterlife (v2)
Pierwszy projekt, który wykonałem po powrocie do gry w 2013 roku. Jest niewiele bardziej skomplikowany od wersji Glass, a dużo ładniej się prezentuje. Niestety nie jestem w tej chwili w stanie zrobić wersji, której łatwo i szybko by się zmieniało kolor - więc tymczasowo daję Wam do dyspozycji tylko czerwoną. Z czasem przybędzie więcej, jak ta wersja okaże się być popularna.
Screenshot: http://i.imgur.com/sSBYG4m.png
Kod: http://pastebin.com/Cur7eypz
Transparent (v3)
Afterlife z całkowicie przezroczystymi tabelami. Po prostu.
Screenshot: http://i.imgur.com/NO4DvFb.jpg
Kod: http://pastebin.com/PDMhtfus
Momentary (v4)
Ulepszona wersja Afterlife. Nieco bardziej dopracowana i dostosowana do nowego myku, który wtedy wymyśliłem - inny obrazek podmieniający avatar. Ten dodatek znajdziecie w tym temacie, na samym końcu. Jak macie taką chęć.
Screenshot: http://i.imgur.com/mwEDBp4.png
Kod: http://pastebin.com/gAkL9cym
Cyber (v5)
To z kolei ulepszona wersja Momentary z kilkoma fajnymi dodatkami. Zależało mi na tym, żeby tabele uzyskały wygląd futurystycznych "wyświetlaczy", stąd te desenie przy ramkach. Nie skłamię, jeśli powiem, że nie wyszło tak, jak chciałem. Mimo to, jest całkiem nieźle.
Screenshot: http://i.imgur.com/TflFuhq.jpg
Kod: http://pastebin.com/JXz9fK6E
Verity (v6)
Najdoskonalsza wersja z serii. Najwięcej czasu spędziłem na dopieszczaniu jej i najlepiej dopasowałem szczegóły. Wygląda zwyczajnie najlepiej. Choć... Nadal nie zmienia to faktu, że wszystko zależy od tła. Najlepiej, jak jest ciemne, a kluczowy punkt znajduje się po prawej (z racji, że tabele są wyrównane do lewej - ale to można łatwo zmienić, jeśli komuś to nie odpowiada).
Screenshot: http://i.imgur.com/EiKuUAz.jpg
Kod: http://pastebin.com/8zxcd2gD
Hyouka (v7)
Nieznany projekt Quaz'a ma dziś swoją premierę! Jest on inny - co pokazuje zestawienie. Jest on z lekka podobny do Facebook'a. Polecam zabawę kolorami u niego, może fajnie wyjść jeżeli dopasujemy go do swoich potrzeb. Sam dokończyłem niektóre drobnostki w kodzie oraz pomagałem przy tworzeniu.
Screenshot: http://i.imgur.com/i1DHxVS.png
Kod: http://pastebin.com/Fi9SkVUQ
Dodatki
Własny obrazek zamiast skinu postaci
Wczoraj nastąpił dzień, gdy wreszcie udało mi się dostosować kod tak, by działał inaczej, niż dotąd. Część z Was korzystała z tego myku i częściowo wie, jak do tej pory działał - obrazek zmieniał skin postaci będącej na pewnym miejscu w karcie gracza - kolejno pierwszym, drugim, trzecim... I było to niewygodne dla osób, które grały kilkoma postaciami naraz, bo gdy ustawiło się obrazek swojego czarnucha z South Bentral na pierwsze miejsce, a potem weszło na postać delikatnej Japonki... To okazywało się, że jest się wyjątkowo muskularną i czarną kobietą. To niezbyt wygodne. Dlatego, ta-dam! Kod, który zczytuje UID postaci!
.ipsButton_secondary.hrpCharItem>a[href^="https://net4game.com/index.php?app=hrp&module=ajax§ion=character&do=details&char=107206"]>img{width:1px;height:1px;padding:165px 140px 0 0;background:url("LINK DO OBRAZKA") no-repeat scroll center center/ 100% auto transparent; border: 2px solid white; box-shadow: 0 0 1px #333333;}
Zwróćcie uwagę na link znajdujący się w środku, tan kończący się na cyfrach "107206" - to jest UID mojej postaci, Dżonatona Brałna. Wystarczy teraz zmienić ową liczbę na UID Waszej postaci, żeby obrazek był przyklejony tylko do niej! Zwróćcie uwagę, że wystarczy wkleić kod drugi raz i ustawić inne UID, żeby dwie postacie miały swoje zdjęcia, ewentualnie trzy... I tak dalej, wymieniać w nieskończoność. 
Rozszerzony avatar
To jest rzecz dostosowana do projektów v4, v5, v6 oraz v7. Może działać na niektórych innych, ale nie musi. To po prostu powiększony avatar - dłuższy i szerszy, ładniej wyglądający. Jak obraz.
#profile_photo {max-height: 1px;max-width: 1px;}.photo_holder .ipsUserPhoto {background: url("LINK DO OBRAZKA") no-repeat scroll center bottom / 100% auto transparent;border: 3px solid #DDDDDD;box-shadow: 0 0 2px #777777 inset, 0 0 2px #777777;padding: 0 90px 263px;}
Tutaj nie ma dużej filozofii, po prostu wstawić link do obrazka. Nie trzeba nic więcej dostosowywać.Obrazek zamiast nicku w profilu
Uważajcie, żeby obrazek nie przekroczył ~130px szerokości i 30px wysokości.
Wersja z gwiazdką przed nickiem:
.ipsType_pagetitle {font-size: 1px;height: 30px; width:100px; color: transparent; background: url('http://net4game.com/public/style_images/master/star.png') no-repeat 0, url('LINK DO OBRAZKA') no-repeat 15px; text-shadow: none;}
Wersja bez gwiazdki:
.ipsType_pagetitle {font-size: 1px;height: 30px; width:100px; color: transparent; background: url('LINK DO OBRAZKA') no-repeat 15px; text-shadow: none;}
Dodatkowa tabela
Tabela w stylu statystyk w profilu, z miejscem na nagłówek i główną zawartość.
<div class="general_box"><h3>Nagłówek</h3><div style="padding:10px">Zawartość</div></div>
Wyśrodkowanie postaci
Prosty kod który wyśrodkowuje wszystkie postacie. Należy dodać pomiędzy <style></style>, tak by się nie gryzł z innym kodem.
.ipsList_inline {text-align:center}
Kilka wskazówek:
1. UNIKAJ ENTERU JAK OGNIA PIEKIELNEGO PRZY WPISYWANIU KODU DO EDYTORU NA FORUM. On czyta entery jako tagi <br />, przez co później nie będzie czytał kodu CSS!
2. Kod wklejajcie z pastebina do notatnika/Notepada, dopiero w tym miejscu wykonujecie ewentualne zmiany. Doszły mnie słuchy, że edytor HTML na forum chędoży czasami kod w większym stopniu od samych enterów.
3. W każdym projekcie macie na początku wydzielony króciutki skrawek stylu, w którym macie na ogół tło i globalne ustawienia, przykładowo styl czcionki. Ten kawałek możecie edytować do woli - nawet jak go zepsujecie, to reszta powinna działać mimo to.
4. Nie jestem Waszym Murzynem, nie będę robił wszystkiego za Was. Udostępniam Wam działający kod, ale nie pomogę Wam, jeśli nie potraficie go poprawnie edytować. To naprawdę nie jest trudne.
5. Jeśli grzebiesz w kodzie, to nie zapomnij o backupie. Jak zdupczysz coś w środku, to połowa kodu przestanie działać.
6. Wszyscy, dla których kiedyś zrobiłem profil na zamówienie a jego kod znalazł się tu - mają u mnie dożywotni props i być może kiedyś darmowy, w pełni oryginalny kod.
7. Nie wrzucajcie tych kodów na inne fora, a jeśli już to robicie - nie zapominajcie, że ja jestem autorem. Ładnie proszę.
rand() % users;
Jeżeli autor wyraża zgodę to polecam generator CSS, http://www.css3maker.com/
Korzystam gdy chcę dobrać kolor tabelek, przeźroczystość itp.
Użytkownik Vernon edytował ten post 13/06/2018 - 13:14
