Forum portalu Fan-Strefa.pl Forum portalu Fan-Strefa.pl 

Autor Wątek: kodowanie wygladu pod newsy  (Przeczytany 1904 razy)

Rubinek

  • Gość
kodowanie wygladu pod newsy
« dnia: 07 Czerwiec 2011, 21:44:15 »
u niektorych na stronach widze pociete na male kawalki czesci wygladu newsow jak wy to kodujecie
bo wtedy wiem ze i data i info news nie bedzie sie rozjezdzac jak bywa to przy ustawieniu pozycji

Stysia

  • Fanatyk
  • ****
  • Wiadomości: 568
  • Reputacja: 6
    • Zobacz profil
    • VANILLA NINJA FANSITE
Odp: kodowanie wygladu pod newsy
« Odpowiedź #1 dnia: 08 Czerwiec 2011, 19:22:12 »
Ja robie to automatycznie w ps... Jest opcja pocięcia strony i zapisać to jako HTML
WWW.VANILLANINJA.NET - POLSKA STRONA FANÓW VANILLA NINJA

PA_BLO

  • Administrator
  • Fan Strefowicz
  • *****
  • Wiadomości: 2529
  • Reputacja: 116
    • Zobacz profil
    • Degrassi Poland
Odp: kodowanie wygladu pod newsy
« Odpowiedź #2 dnia: 08 Czerwiec 2011, 22:05:16 »
Ja też tnę automatycznie w Photoshopie i zapisuje dla Web'a. Program generuje mi sam kod tabelki i pociętą grafikę spakowana w folder. Wtedy można dowolnie edytować kod dla swoich indywidualnych potrzeb.
Do you want more?


Evan

  • VIP
  • Fan Strefowicz
  • *****
  • Wiadomości: 1954
  • Reputacja: 35
    • Status GG
    • Zobacz profil
Odp: kodowanie wygladu pod newsy
« Odpowiedź #3 dnia: 08 Czerwiec 2011, 22:07:39 »
Ale minusem są tabele

PA_BLO

  • Administrator
  • Fan Strefowicz
  • *****
  • Wiadomości: 2529
  • Reputacja: 116
    • Zobacz profil
    • Degrassi Poland
Odp: kodowanie wygladu pod newsy
« Odpowiedź #4 dnia: 09 Czerwiec 2011, 07:58:58 »
Dlaczego tak uważasz? Ja tam lubię tabele zarówno jak i div'y. Ostatnio stosowałem divy, ale zauważyłem że na tabelach tez można zbudować całkiem niezły kod.
Do you want more?


Rubinek

  • Gość
Odp: kodowanie wygladu pod newsy
« Odpowiedź #5 dnia: 09 Czerwiec 2011, 12:26:29 »
aha czyli potne na kawalki w ps'e i ten kod wstawic do index.php 
dzikei nie pomyslalam o tym jaka jestem glupa

PA_BLO

  • Administrator
  • Fan Strefowicz
  • *****
  • Wiadomości: 2529
  • Reputacja: 116
    • Zobacz profil
    • Degrassi Poland
Odp: kodowanie wygladu pod newsy
« Odpowiedź #6 dnia: 09 Czerwiec 2011, 18:23:28 »
aha czyli potne na kawalki w ps'e i ten kod wstawic do index.php 
dzikei nie pomyslalam o tym jaka jestem glupa
Nie tak bez modyfikacji. Czasami trzeba zmienić właściwości niektórych komórek. Trzeba wiedzieć w której komórce można sobie pozwolić aby wstawić obrazek a w której ten obrazek przemienić na tło komórki, już nie wspominając o tym w której trzeba wstawić kod do wyświetlania się postów, daty, kategorii, autora itp. Trzeba mieć czujne oko. Photoshop daje tylko zarys kodu tabeli sporządzonej na podstawie pociętej grafiki. To od nas samych zależy w której cześci kodu co chcemy umieścić ... Photoshop już tego za nas nie zrobi :/
Do you want more?


Evan

  • VIP
  • Fan Strefowicz
  • *****
  • Wiadomości: 1954
  • Reputacja: 35
    • Status GG
    • Zobacz profil
Odp: kodowanie wygladu pod newsy
« Odpowiedź #7 dnia: 09 Czerwiec 2011, 19:37:06 »
Ja też tnę automatycznie w Photoshopie i zapisuje dla Web'a. Program generuje mi sam kod tabelki i pociętą grafikę spakowana w folder. Wtedy można dowolnie edytować kod dla swoich indywidualnych potrzeb.


-więcej kodu przez co łatwiej się pomylić
-Albo np chce sobie zmienic kolumne z lewej na prawa strone i w divach zajmie mi to sekunde bo to kwesta jednej linijki w css a z tabelami trzeba się namęczyć
-większy rozmiar strony przez co wolniej się wczytują strony



PA_BLO

  • Administrator
  • Fan Strefowicz
  • *****
  • Wiadomości: 2529
  • Reputacja: 116
    • Zobacz profil
    • Degrassi Poland
Odp: kodowanie wygladu pod newsy
« Odpowiedź #8 dnia: 09 Czerwiec 2011, 19:48:33 »
-więcej kodu przez co łatwiej się pomylić
-Albo np chce sobie zmienic kolumne z lewej na prawa strone i w divach zajmie mi to sekunde bo to kwesta jednej linijki w css a z tabelami trzeba się namęczyć
-większy rozmiar strony przez co wolniej się wczytują strony
- co do ilości kodu to się zgodzę, bo jest tego więcej,
- co do zmiany kolumn z lewej na prawą lub odwrotnie to trudniej jest mi sie połapać w divach, gdyż ostatnio miałem z tym problemy a tabela wszystko rozwiązała,
- a jeżeli chodzi o wczytywanie się strony, to strona składająca się z pociętej grafiki wczytuje się moim zdaniem o wiele szybciej ... i nie wiem czy to ma znaczenie czy grafika jest częścią tabeli czy div'a bo kod chyba wczytywany jest jednocześnie w obu przypadkach.

Ale dzięki za uwagi, możliwe mylę się i Ty masz rację xD
Do you want more?


Kalleye

  • Gość
Odp: kodowanie wygladu pod newsy
« Odpowiedź #9 dnia: 09 Czerwiec 2011, 21:03:45 »

- a jeżeli chodzi o wczytywanie się strony, to strona składająca się z pociętej grafiki wczytuje się moim zdaniem o wiele szybciej ... i nie wiem czy to ma znaczenie czy grafika jest częścią tabeli czy div'a bo kod chyba wczytywany jest jednocześnie w obu przypadkach.

To czy częścią tabeli czy diva raczej znaczenia nie ma, ale osobiście uważam, że pocięta grafika spowalnia ładowanie strony. Jeśli np. cały nagłówek ma się wgrywać powiedzmy 18 sek a każdy kawałek 2 sek a kawałków dużo to chyba szybciej ładuje się grafika w jednym kawałku :)

Evan

  • VIP
  • Fan Strefowicz
  • *****
  • Wiadomości: 1954
  • Reputacja: 35
    • Status GG
    • Zobacz profil
Odp: kodowanie wygladu pod newsy
« Odpowiedź #10 dnia: 09 Czerwiec 2011, 21:49:28 »
-więcej kodu przez co łatwiej się pomylić
-Albo np chce sobie zmienic kolumne z lewej na prawa strone i w divach zajmie mi to sekunde bo to kwesta jednej linijki w css a z tabelami trzeba się namęczyć
-większy rozmiar strony przez co wolniej się wczytują strony
- co do ilości kodu to się zgodzę, bo jest tego więcej,
- co do zmiany kolumn z lewej na prawą lub odwrotnie to trudniej jest mi sie połapać w divach, gdyż ostatnio miałem z tym problemy a tabela wszystko rozwiązała,
- a jeżeli chodzi o wczytywanie się strony, to strona składająca się z pociętej grafiki wczytuje się moim zdaniem o wiele szybciej ... i nie wiem czy to ma znaczenie czy grafika jest częścią tabeli czy div'a bo kod chyba wczytywany jest jednocześnie w obu przypadkach.

Ale dzięki za uwagi, możliwe mylę się i Ty masz rację xD

Divy szybciej się wczytują może tego nie zauważasz ale tak jest szczególnie przy b.rozbudowanych stronach !
To jest tak samo jak byś miał przeczytać 200 stron lub 50 i wiadomo że 50 przeczyta się szybciej XD

Rubinek

  • Gość
Odp: kodowanie wygladu pod newsy
« Odpowiedź #11 dnia: 10 Czerwiec 2011, 17:03:16 »
aha czyli potne na kawalki w ps'e i ten kod wstawic do index.php 
dzikei nie pomyslalam o tym jaka jestem glupa
Nie tak bez modyfikacji. Czasami trzeba zmienić właściwości niektórych komórek. Trzeba wiedzieć w której komórce można sobie pozwolić aby wstawić obrazek a w której ten obrazek przemienić na tło komórki, już nie wspominając o tym w której trzeba wstawić kod do wyświetlania się postów, daty, kategorii, autora itp. Trzeba mieć czujne oko. Photoshop daje tylko zarys kodu tabeli sporządzonej na podstawie pociętej grafiki. To od nas samych zależy w której cześci kodu co chcemy umieścić ... Photoshop już tego za nas nie zrobi :/
biore sie do roboty mam nadzieje ze mi sie uda
jesli nie to mam nadzieje ze pomożecie
« Ostatnia zmiana: 10 Czerwiec 2011, 20:39:37 wysłana przez Rubinek »

PA_BLO

  • Administrator
  • Fan Strefowicz
  • *****
  • Wiadomości: 2529
  • Reputacja: 116
    • Zobacz profil
    • Degrassi Poland
Odp: kodowanie wygladu pod newsy
« Odpowiedź #12 dnia: 11 Czerwiec 2011, 14:15:38 »


Mam prośbe, otóż potrzebuje rady w pozycjonowaniu DIV'ów w głównym DIV'ie.
Sprawa wygląda tak. Mam głównego div'a który będzie mieścił w sobie 4 inne (oznaczone kolorami na grafice powyżej). Divy oznaczone kolorem żółtym nie będą zawierać żadnej treści tylko mają służyć do wyznaczania odległości pomiędzy krawędziami a dwoma środkowymi div'ami. Kolorem zielonym został oznaczony sidebar a białym główna treść strony. Problem polega na tym, że nie mam pojęcia jak ułożyć te 4 div'y poziomo w linii względem siebie, ponieważ każdy wyświetla mi się jeden pod drugim. Może coś przekombinowałem z tymi selektorami float?

Oto CSS:

#wrapper {
background-image: url(...);
background-repeat:repeat-y;
width: 1028px;
margin-bottom: 0;
margin-left: auto;
margin-right: auto;
margin-top: 0;
top: 870px;}

#wrapper-top {
width: 1028px;
height: 62px;
background-image: url(...);}

#wrapper-bottom {
width: 1028px;
height: 56px;
background-image: url(...);}

#left {
width: 39px;
background: transparent;
float: left;
overflow: hidden;
display:inline;}

#sidebar {
width: 350px;
background: transparent;
float: left;
overflow: hidden;
display:inline;}

#content {
width: 600px;
background: transparent;
float: left;
overflow: hidden;
display:inline;}

#right {
width: 39px;
background: transparent;
float: left;
overflow: hidden;
display:inline;}

A tak wygląda kod w pliku header.php

<div id="wrapper">
<div id="wrapper-top"></div>
<div id="left"></div>
<div id="sidebar"></div>
<div id="content"></div>
<div id="right"></div>
<div id="wrapper-bottom"></div>
</div>

Ponadto DIV #content nie wyświetla mi się w głównym DIV'ie #wrapper, tylko na dole. Nie wiem czym to jest spowodowane. Nie widzę abym pominął jakiś znacznik. Proszę o pomoc. Może nie należy zamykać DIV'a?
Do you want more?


Evan

  • VIP
  • Fan Strefowicz
  • *****
  • Wiadomości: 1954
  • Reputacja: 35
    • Status GG
    • Zobacz profil
Odp: kodowanie wygladu pod newsy
« Odpowiedź #13 dnia: 11 Czerwiec 2011, 16:22:52 »
dwa divy po bokach nie są potrzebne

robisz tak
<div id="main">
<div id="content">
</div>
<div id="sidebar">
</div>
</div>

dla main  w css margin:0 auto; dzięki temu się wyśrodkuje 
dla div content  float:left
dla div sidebar float:left

muszą być te same strony  i musimy nadać im szerokość inaczej będą jeden pod drugim !

PA_BLO

  • Administrator
  • Fan Strefowicz
  • *****
  • Wiadomości: 2529
  • Reputacja: 116
    • Zobacz profil
    • Degrassi Poland
Odp: kodowanie wygladu pod newsy
« Odpowiedź #14 dnia: 11 Czerwiec 2011, 21:46:07 »
Niestety to też nie pomogło ... zawsze mam problemy z tym samym elementem przy kodowaniu.
http://www.upload.fan-strefa.pl/images/405prev1.jpg

CSS :
#wrapper{
background-image: url(...);
background-repeat:repeat-y;
width: 1028px;
margin-bottom: 0;
margin-left: auto;
margin-right: auto;
margin-top: 0;
top: 870px;}

#sidebar{
width: 350px;
background: transparent;
float: left;}

#content{
width: 600px;
background: #FFFFFF;
float: left;}

#page{
width: 950px;
align: center;}

A to zawartość header.php
<div id="wrapper">
<img src="..." width="1028" height="62" alt="">
<div id="page">
<div id="content">
<div id="sidebar"></div>
</div>
<img src="..." width="1028" height="56" alt="">
</div>

content i sidebar dodatkowo umieściłem w div'ie page aby zlikwidować zbędne dwa divy umieszczone wcześniej po bokach.
Zwróc uwagę, że gdy daje niezamkniętego div'a content to sytuacja wygląda tak jak na załączonym obrazku, a gdy już go zamknę to całkowicie przesuwa mi się on na lewą stronę. Wychodzi na to, że coś jest nie tak z div'em wrapper.
Do you want more?


Forum portalu Fan-Strefa.pl

Odp: kodowanie wygladu pod newsy
« Odpowiedź #14 dnia: 11 Czerwiec 2011, 21:46:07 »