Soporte » Diseño – Temas y plantillas » Modificar ancho de columnas en la home

  • He realizado una web utilizando el tema TheSource y me gustaría ampliar el ancho de la columna derecha de la home, y también el ancho donde se muestran las 4 categorías debajo del slide.

    La URL de mi web es http://s414608532.mialojamiento.es/scalping/

    Si accedéis a ella veréis claramente el porqué quiero aumentar el ancho, debido a que las tablas que se muestran son más grandes que el ancho de la columna.

    Muchas gracias.

    Alberto

Viendo 14 respuestas - de la 1 a la 14 (de un total de 14)
  • Hola Alberto. Una solución rápida puede ser que inviertas las posiciones del contenido que tienes en las divs firstcol y secondcol (en los sidebar). Cambias el tamaño de la primera adaptandola al ancho de las tablas, la segunda te quedaría más pequeña pero como solo tienes ‘archivos’ e ‘información’ no quedarian mal.

    Iniciador del debate cascamorris

    (@cascamorris)

    Estoy editando el style.css y modifico algunos valores, como estos:

    #sidebar #firstcol { width: 160px; }

    #sidebar #secondcol { width: 162px; }

    pero no veo ningún cambio.

    Son estos??? soy bastante novato con wordpress, es la primera vez que lo toco, así que cualquier ayuda será bienvenida.

    Gracias!!!

    De nuevo hola Alberto.

    Sí, esas son las propiedades que tienes que modificar pero no notas ningún cambio porque tienes otra propiedad que te cambia de nuevo el tamaño.

    body#home #sidebar #firstcol, body#home #sidebar #secondcol {
        width: 239px;
    }

    Recuerda que en CSS si colocas en una clase un valor y más abajo hay otra que actua sobre la primera la sobre escribirá, es decir, la última propiedad es la que manda, ejemplo:

    carlos=mujer

    carlos=hombre

    Para este pequeño ejemplo carlos será igual a ‘hombre’ aunque le hubieramos colocado previamente el valor ‘mujer’.

    prueba modificando esa linea con algo como:

    body#home #sidebar #firstcol {
        width: 239px; /*El tamaño que requieras*/
    }
    body#home #sidebar #secondcol {
        width: 100px; /*El tamaño que requieras*/
    }

    Así debería funcionar.

    Suerte.

    Iniciador del debate cascamorris

    (@cascamorris)

    muchas gracias!!!!!! voy a probar a ver si así funciona.

    Iniciador del debate cascamorris

    (@cascamorris)

    He añadido este código al final del css.

    body#home div.container { width: 1050px!important; }
    body#home #sidebar { width: 570px!important; }
    body#home #sidebar #secondcol, body#home #sidebar div.widget { width: 330px!important; }

    el problema está que aumenta la segunda y como bien indicas, lo que debería hacer es aumentar la primera y disminuir la segunda.

    el resultado se puede ver aquí: http://s414608532.mialojamiento.es/scalping/

    Gracias!!!!

    Hola Cascamorris.

    Amigo, elimina esto que colocaste:

    body#home #sidebar #secondcol, body#home #sidebar div.widget { width: 330px!important; }

    y copia y pega esto justo donde estaba lo anterior:

    body#home #sidebar #secondcol div.widget {
        width: 330px !important;
    }
    div#sidebar div#firstcol div.widget {
        width: 239px !important;
    }

    Con eso se soluciona. Prueba verlo desde otros navegadores porsi, sobre todo con Internet Explorer.

    Avisa cualquier problema.

    Saludos.

    Iniciador del debate cascamorris

    (@cascamorris)

    Se superponen las columnas.

    Lo he probado en varios navegadores (chrome y explorer) y se ve igual.

    http://s414608532.mialojamiento.es/scalping/

    Ya las he ajustado al ancho que deberían tener y el contenido lo he movido.

    Y debería desplazarse también la barra vertical que separa las columnas, puesto que se queda en la misma posición.

    Muchas gracias!!!!

    Amigo Cascamorris, creo que la cosa se esta complicando un poco, espero que tengas una copia de la hoja de estilo de tu plantilla.

    Lo que estamos haciendo es practicamente una chapuza debido a que tendriamos que borrar y no sobreescribir elementos pero bueno…

    pega esto al final de la hoja:

    body#home div#sidebar div#firstcol {
        width: 329px;
    }

    los bordes rojos de firstcol lo quitas borrando border: 1px solid red;

    div#sidebar div#firstcol div.widget {
        border: 1px solid red; /*debes borrar toda esta línea*/
        width: 329px;
    }

    Con eso si se va a cuadrar aunque vamos a tener otro problemita que lo vas a ver. Para solucionarlo tienes que modificar unas imagenes de fondo…

    La cosa se esta complicando te lo repito, te recomiendo que tengas una copia de tu hoja de estilo y de tu plantilla.

    Saludos.

    Iniciador del debate cascamorris

    (@cascamorris)

    Muchas gracias Shinjiru_fred por tu ayuda!!!

    Tengo realizada una copia de todo, no te preocupes.

    Ahora mismo he añadido al final del css lo siguiente:

    body#home #sidebar #secondcol div.widget {
    width: 330px !important;
    }
    div#sidebar div#firstcol div.widget {
    width: 239px !important;
    }
    body#home div#sidebar div#firstcol {
    width: 329px;
    }

    Como podrás comprobar la segunda columna aparece debajo la primera.

    http://s414608532.mialojamiento.es/scalping/

    Gracias!!!

    Vamos a hacer algo, borra todo lo que te he dicho que hagas, hagamos una chapuza más elegante.

    Avisame por aquí cuando lo hagas.

    Iniciador del debate cascamorris

    (@cascamorris)

    Hecho!!!

    En esta URL podrás encontrar el style.css, por si te hace falta.

    http://s414608532.mialojamiento.es/style.css

    Muchísimas gracias!!!

    Hola amigo Cascamorris.

    Entra en este link y copia el código en el final de tu hoja css.

    http://wordpress.pastebin.ca/2151812

    Tambien necesitas descargar y guardar las siguientes imágenes en la carpeta images de tu plantilla, recuerda conservar los nombres de la imágenes.

    http://imageshack.us/photo/my-images/23/ms6zky9f.png/

    http://imageshack.us/photo/my-images/17/p1fivb39.png/

    Con eso ya deberían estar resueltos los problemas.

    Saludos.

    Iniciador del debate cascamorris

    (@cascamorris)

    Muchas gracias Shinjiru_fred!!!!!!!

    Perfecto!!

    Ahora encaja todo.

    Muy agradecido!!!

    Saludos.

    Cristobal

    (@cristobal-paez)

    buenas tardes, uso el tema Oxygen y la verdad qu eno encuentro ninguna d elas funciones que uds especifican aqui. Necesito agrandar la columna. pero cuando modifico las cantidades desde la CSS Stile y en LAYOUT cambia todo. alguna idea?

Viendo 14 respuestas - de la 1 a la 14 (de un total de 14)
  • El debate ‘Modificar ancho de columnas en la home’ está cerrado a nuevas respuestas.