kuroneko

Topic: Modificar diseño

Me he registrado en un huevo de sitios y no sé ya donde preguntar.
uso un tema de Wordpress (chaotic soul) y quiero ensancharlo y añadirle una columna para situar las paginas a un lado junto con las categorias y lo demas, como por ejemplo el RSS contadores links y demas al otro, ¿como lo podria hacer? esque hacer un tema nuevo dado que no sé PHP solo me defiendo, me es imposible y el resto de temas, haya mil o dosmil,  no se adecuan a mis necesidades por anchura, por tamaño de banner o por situacion de las paginas (obligatoriamente necesito que se encuentren en los laterales) llevo 3 dias buscando y me he registrado en una cantidad de sitios para buscar solucion impresionante, os agradeceria una respuesta.
Y si alguien conoce algun tema cuyo cuerpo sea del mismo tamaño o mayor, tenga tres columnas el banner sea aproximadamente del mismo y pueda ser modificado en lo que respecta a colores con facilidad pues que me lo diga, por favor.

Gracias por contestar

PD: Os dejo el Link para que entendais porque necesito un tema parecido pero con más columnas banner igual y mas ancho.
http://www.velvet-nightmare.com/

IMO

Re: Modificar diseño

Si la verdad que esta un poco solo, pa mi gusto :-)

Aqui  te muestro una buena pagina de themes, http://themes.wordpress.net/?cats%5B%5D … ubmit=Show

Solo ayudare a los posts con fecha 2008, y para que estos no los repitan usen buscar, por si esta el tema ya comentado, Gracias!

http://feeds.feedburner.com/gr-feed.1.gif

elTrauko

Re: Modificar diseño

Kuroneko,
no se si has resuelto tu problema, pero para modificar el ancho de las columnas solo debes editar el archivo style.cssen el directorio de tu plantilla.

los anchos estan indicados en estas secciones -->

div#left {
background-color:#003D53;
background-image:url(images/bkg3.jpg);
float:left;
width:220px;             --------------> este es el ancho de la columna izquierda (se puede
}                                         modificar) 

div#rightbox {
background-color:#052D35;
background-image:url(images/bkg.jpg);
float:left;
margin:0 0 0 20px;
width:580px;             --------------> este es el ancho de la columna central (se puede modificar)
}

div#rightpanel {
float:right;
font-size:10px;
margin:0 0 0 20px;
width:160px;             --------------> este es el ancho de la columna derecha (se puede modificar)
}

la suma de los tres width debe ser 960px

cuidado que el div a continuacion contiene la sección central y la derecha

div#right {
float:right;
width:780px;             --------------> ancho de las colunas central y derecha --- si es necesario
}                                         si es necesario se puede modificar

y este otro contiene a las tres secciones
div#container {
margin:10px auto;
width:1000px;              -----------> ancho fijo de la pagina -- si desea una pagina mas ancha puedes modificarlo.
}

Suerte

estoy_inz

Re: Modificar diseño

Wow! esto es realmente un foro increíble! Gracias por esas soluciones. Esto es cool,, gracias por la gran ayuda!

Marlimant

Re: Modificar diseño

Hola: Yo también necesito ensanchar las columnas de los lados y la del medio pero no encuentro los indicadores que puso elTrauko. Y ahora.... ¿Quién podrá ayudarme? Adjunto mi Style.css

Code:

/*
Theme Name: WordPress Theme Generator 
Theme URI: http://www.yvoschaap.com/wpthemegen/
Version: 13 Nov, 22:23
Author: W.P. Gen
Author URI: http://www.yvoschaap.com/

*/

html>body #content {
    height: auto;
    min-height: 580px;
}

body{
    font-family: verdana;
    font-size: 95%;
    line-height: 115%;
    background-color: #255571;
    background-image: url(yoururl);
    background-repeat: no-repeat;
    background-position: center top;
    text-align: center;
}

body,td,th {
    color: #000000;
}



a, a:link {
    padding: 1px;
    color: #006999;
    text-decoration: none;
}

a:hover {
    color: #3704DE;
    text-decoration: underline;
    ;
}

h1 {
    font-family: georgia;
    font-weight: bold;
    font-size: 190%;
    padding-top: .1em;
    padding-bottom: .5em;
}


h2 {
    font-family: Arial;
    font-weight: bold;
    font-size: 150%;
}

h3 {
    font-family: georgia;
    font-size: 130%;
}


h4 {
    font-size: 105%;
}

p {
    font-size: 80%;
    margin-bottom:1em;
}

strong, b {
    font-weight: bold;
}

em, i {
    font-style: italic;
}

code {
    font: 1.1em 'Courier New', Courier, Fixed;
}

acronym, abbr
{
    font-size: 0.9em;
    letter-spacing: .07em;
}

a img {
    border: none;
}


#hd{
    text-align: center;
    padding-top: 24px;
    padding-bottom: 24px
}
#hd h1{
    font-size: 290%;
    color: #FFFFFF;

}

#hd h1 a{
    text-decoration: none;
    color: #FFFFFF;
}

h3 a:link, h3 a:hover, h3 a:visited{
    color: #006999;
}

.item {
    padding: 10px;
    background-color: #FFFFFF;
    background-image: url(yoururl); 
    background-repeat: no-repeat;
    text-align:left;
    border: 1px solid #1A1A1A;
    margin-bottom: 1em;
    ;
    
}

.item ul {
    list-style-type: disc;
    padding-left: 15px;
    margin-left: 10px;
    font-size: 80%;
}


.item ol{
    list-style-type: decimal;
    padding-left: 15px;
    margin-left: 10px;
    font-size: 80%;
}

.itemhead{
    padding-top: 5px;
    padding-bottom: 5px;
}


.chronodata {
    display: inline;
    text-align: right;
    margin-left: 2em;
    font-size: 80%;
}


.itemhead h3{
    display: inline;
}


input{
    font-size: 80%;
}

.metadata{
    line-height: 190%;
    font-size: 75%;
}

.metadata a:link, .metadata a:hover, .metadata a:visited{
    color: #006999;
}

.tags, .catagory {

    display: block;

}

.commentlist p {
    clear: both;
    font-size: 95%;
}


cite{
    font-size: 95%;
}

blockquote {
    margin: 15px 30px 0 10px;
    padding-left: 20px;
    border-left: 5px solid #ddd;
    }

blockquote cite {
    margin: 5px 0 0;
    display: block;
}

.commentmetadata {
    font-size: 80%;
    float: right;

}
.commentlist {
    margin-top: 5px;
}
.commentlist li {
    padding: 2px;
    border-top: 1px solid #1A1A1A;
}

.navigation {
    display: block;
    text-align: center;
    margin-top: 10px;
    margin-bottom: 10px;
    color: #FFFFCC;
}

.navigation a:link, .navigation a:hover, .navigation a:visited{
    color: #FFFFCC;
}

.alignright {
    float: right;
}

.alignleft {
    float: left
}


#secondary, #third{
    background-color:  ;
    background-image: url(/); 
    background-repeat: no-repeat;
    text-align:left;
    padding: 0px;
    border: 1px solid #1A1A1A;
    SP_GRADIENT
}

#secondary h4, #third h4{
    color: #FFB70F;
    font-family: Trebuchet MS, arial, sans-serif;
    margin-top: 5px;
    padding: 3px;

}

#secondary p, #third p{
        padding: 3px;
        font-size: 70%;
}

#searchform {
    clear: both;
    margin-bottom: 5px;
    margin-left: 2px;
    padding: 3px;
}

#third {
    margin-left: 9px;
}

#menu {padding:0; border:0px solid #fff }
#menu ul {list-style:none; margin:0; padding:0; font-size:85%; }
#menu ul li { padding:0; margin:0; border-bottom:1px solid #FFFFFF; }
#menu ul li a { display:block; padding:4px 4px 4px 10px; text-decoration:none; color: #FFFFFF; }
#menu ul li a:hover { color:myheadttcolor; background: #0099DD; }


li .categories, li .linkcat, li .pagenav {
    list-style: none;
    margin: 0px;
    padding: 0px;
}

.yui-nav{
    margin-bottom: -1px;
}

.yui-navset .yui-nav a:hover {
    background-color: #0099DD;
    color: #FFFFFF;
}

.yui-navset .yui-nav li a {
    background-color: #FFFFFF;
    background-image: url(yoururl); 
    background-repeat: no-repeat;
    border-bottom: 0px;
    color: #FFFFFF;
    padding: .3em .7em .3em .7em;
    text-decoration:none;
    font-size: 85%;
}



#wp-calendar {
    empty-cells: show;
    font-size: 90%;
    margin: 0;
    width: 90%;
    padding: 3px;
}

#wp-calendar #next a {
    padding-right: 10px;
    text-align: right;
}

#wp-calendar #prev a {
    padding-left: 10px;
    text-align: left;
}

#wp-calendar a {
    display: block;
    text-decoration: none;
}


#wp-calendar td {
    color: #FFFFFF;
    font-size: 70%;
    letter-spacing: normal;
    padding: 2px 0;
    text-align: center;
}


#wp-calendar #today {
    background: ;
    color: #0099DD;
}

#wp-calendar th {
    font-style: normal;
    text-transform: capitalize;
}

#ft {
    text-align: center;
    margin-top: 10px;
    margin-bottom: 10px;
    color: #FFFFCC;
}

#ft a:link, #ft a:hover, #ft a:visited{
    color: #FFFFCC;
}

Last edited by Marlimant (2008-11-13 19:00)