Cómo agregar una cuarta columna a un tema sin sidebar

Multizero · 2015-08-29T16:00:34-0500

Hola betas necesito su ayuda... Les dejare una cap abajo; Pues como ven en la imagen de abajo hay 3 columnas y quiero agregar otra, quiero poner 4 columnas. Pues veran no es un theme con sidebar ni nada simplemente muestra las ultimas entradas y no tiene esas "columnas... El theme es así :encouragement: Les pido POR FAVOR si me ayuda para poder agregar la 4 columna ya que e intentado y no e podido. Gracias de antemano!!

Me explico algo mejor:
Lo que esta en el cuadrado rojo correrlo a la izquierda... y agregar un nuevo lugar para que ahí (En el cuadro verde) quede otro articulo...

important · 2015-08-29T16:41:41-0500

Eso lo querés hacer en todo el index?
Es decir, mostrar de 4 por línea?
El theme no tiene opciones, ya has investigado?

nbenitez · 2015-08-29T16:55:13-0500

El theme debe permitirte hacer eso... investiga

important · 2015-08-29T17:08:20-0500

Debes tocar bastante código para poder llegar a ello, sin embargo, también tenés que tener en cuenta el responsive del theme, ya que hay que ser detallista con ello. El theme en realidad fue maquetado para que tenga 3 columnas, y no 4.
Si el theme no tiene un panel de opciones que te permita editar el grid, lo tendrás que hacer editando código CSS.

Primero, debes quitarle un poco de padding a .main-box-inside que es la clase que contiene a todo los boxs.
Luego a article.vce-post debes fijarle un max-width, editar el margin y quedaría más o menos lo que buscas.

Yo lo hice desde el inspector de elementos en tu web, y esto fue lo que logré.
Obviamente no quedó del todo bien, pero bueno, es más o menos para que te orientes.

Insertar CODE, HTML o PHP:

.main-box-inside {
    float: left;
    width: 100%;
    padding: 10px !important;
}

article.vce-post {
    max-width: 24.5%;
    margin: 0px !important;
    margin-right: 5px !important;
    margin-bottom: 10px;
}

Resultado:

Multizero · 2015-08-29T17:36:18-0500

important dijo:
Debes tocar bastante código para poder llegar a ello, sin embargo, también tenés que tener en cuenta el responsive del theme, ya que hay que ser detallista con ello. El theme en realidad fue maquetado para que tenga 3 columnas, y no 4.
Si el theme no tiene un panel de opciones que te permita editar el grid, lo tendrás que hacer editando código CSS.

Primero, debes quitarle un poco de padding a .main-box-inside que es la clase que contiene a todo los boxs.
Luego a article.vce-post debes fijarle un max-width, editar el margin y quedaría más o menos lo que buscas.

Yo lo hice desde el inspector de elementos en tu web, y esto fue lo que logré.
Obviamente no quedó del todo bien, pero bueno, es más o menos para que te orientes.

Insertar CODE, HTML o PHP:

.main-box-inside { float: left; width: 100%; padding: 10px !important; } article.vce-post { max-width: 24.5%; margin: 0px !important; margin-right: 5px !important; margin-bottom: 10px; }

Resultado:

MUCHAS, MUCHAS... GRACIAS important; Gracias por ayudarme, intente hacer lo que dices y lo que no logro encontrar es article.vce-post { // LA verdad se poco y nada de diseño y esas cosas, En que parte esta ubicado mas o menos? Solo edite .main-box-inside { Espero tu respuesta, de no ser así te lo agradezco de todas formas!!

important · 2015-08-29T18:08:21-0500

Multizero dijo:
MUCHAS, MUCHAS... GRACIAS important; Gracias por ayudarme, intente hacer lo que dices y lo que no logro encontrar es article.vce-post { // LA verdad se poco y nada de diseño y esas cosas, En que parte esta ubicado mas o menos? Solo edite .main-box-inside { Espero tu respuesta, de no ser así te lo agradezco de todas formas!!

Em... primero que nada, fijate si el theme tiene opciones. Segundo, si editas lo que yo te he dado, el responsive del theme va a joder, y tendras que acomodar todo.
Sin embargo, si pones las lineas que te di en el final del documento style.css, éstas se tendrán en cuenta, ya que tienen !important y eso les indica que lo tenga en cuenta si o si.

Insertar CODE, HTML o PHP:

article.vce-post {
    max-width: 24.5% !important;
    margin: 0px !important;
    margin-right: 5px !important;
    margin-bottom: 10px !important;
}

Cómo agregar una cuarta columna a un tema sin sidebar

Multizero

important

nbenitez

important

Multizero

important

Temas similares