Imágenes en página principal de plantilla sin esta opción

Inicio Foros WordPress Themes y Diseño Imágenes en página principal de plantilla sin esta opción

Este debate contiene 22 respuestas, tiene 3 mensajes y lo actualizó  Alias79 hace 5 años, 9 meses.

  • Autor
    Publicaciones
  • #68414

    Alias79
    Participante

    Muy buenas!

    Estoy tratando de darle una tercera (o cuarta) juventud a mi tema Langit, porlo que he decidido añadirle imágenes a las entradas de la página principal.

    El caso es que el tema es tan antiguo que ni si quiera tenía para especificar una imagen destacada.

    Llevo horas leyendo y probando cosas, y he hecho conseguido editar el archivo Style.css para que el tema ya de la opción de asignar una imagen destacada.

    Luego he estado probando a editar el archivo index.php incorporando la línea (la pongo sin los simbolos de “menor que/mayor que”, por que creo que por este motivo no se graba el post en el foro de Ayudawordpress)

    php the_post_thumbnail()

    El resultado es casi casi lo que busco… Inserta la imagen a la izquierda, pero el texto lo pone debajo de la misma; lo que yo busco es que aparezca a la derecha de esta imagen, para que quede algo parecido a lo de la siguiente imagen (es un boceto hecho con Paint.net):

    http://www.nextn.es/wp-content/uploads/2013/02/Prueba-WEB-4.jpg

    (los botones con las categorías que he pegado en el boceto son algo que quiero intentar a hacer en otro momento).

    He probado a buscar la parte del index que inserta ese texto, creo que es esta (edito el código sin los símbolos de menor que/mayor que):

    php the_excerpt(__(‘Read more’))

    He probado montones de combinaciones, y buscado info por aquí y por allá, pero no he conseguido que se ponga el texto a la derecha de la imagen… Me da a mi que tendré que tocar algo más en el style.css, ¿no?

    La web es esta: http://www.nextn.es

    Gracias!!!

  • #68415

    Alias79
    Participante

    No se por que, pero llevo desde ayer intentando escribir este post (suerte que lo grabé en un txt, jejeje) y se borraba todas las veces que lo guardaba. No se si sería por parte del código que he pegado; esto lo remarco por que seguramente será erróneo (lo he editado por si era ese el motivo por el cual no dejaba grabar el mensaje)

    Un saludo!!!

  • #68416

    antoniohg
    Participante

    Le tendrás que poner un float:left a la clase de la miniatura.

  • #68420

    LGrusin
    Miembro

    No sólo la imagen destacada sino para ninguna imagen, no tiene estilos para alinear imágenes. En realidad no te hace falta la imagen destacada, simplemente cuando subas la imagen la alineas a la derecha, centro o izquierda.

    Este código en el archivo style.css cubre la mayoría de themes, puedes personalizar los márgenes para adaptarlo a tus necesidades.

    .alignleft,
    img.alignleft {
    display: inline;
    float: left;
    margin-right: 14px;
    margin-top: 10px;
    }
    .alignright,
    img.alignright {
    display: inline;
    float: right;
    margin-left: 14px;
    margin-top: 10px;
    }
    .aligncenter,
    img.aligncenter {
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
    }
    img.alignleft,
    img.alignright,
    img.aligncenter {
    margin-bottom: 12px;
    }

    Un saludo

  • #68432

    Alias79
    Participante

    No se que pasa, pero no me deja contestarte 🙁 Este post es de prueba

  • #68436

    Alias79
    Participante

    Lo mismo es por los códigos o las URL que pongo que me borra el post cada vez que lo publico.. Bueno, voy a resumir:

    Pues eso no es exactamente lo que buscaba, pero es algo que también me viene bien (hace tiempo que también quería hacerlo!!).  Con esto veo que ahora en las entradas puedo escribir a la derecha o izquierda de las imágenes, me viene genial, de verdad 🙂

    Lo que estaba buscando es modificar el tema para que en la página de inicio muestre la imagen destacada del tema. He modificado el archivo functions.php (no style.css como había dicho… ha sido error al recordar!) con un par de líneas que activan esa función.

    Y he buscado donde colocar el código en index.php para que inserte esa imagen (no pongo el código otra vez por si acaso se borra, jejeje). Creo que se donde ponerlo, pero si lo pongo encima de ese sitio me sale la imagen arriba:

    http://goo.gl/4n1vR

  • #68441

    Alias79
    Participante

    y si lo pongo después, la imagen la coloca debajo:

    http://goo.gl/HIilh

  • #68442

    Alias79
    Participante

    Pero no a la izquierda, que es como había dibujado en la plantilla:

    http://goo.gl/ZT07p

    Espero haberme explicado, ya sabes que soy torpe con estas cosas, jejeje

    PD: Vale, creo que lo que pasa es que no puedes publicar más de una URL por post, no?

  • #68443

    LGrusin
    Miembro

    Vale, quieres usar the_post_thumbnail… Pues conservando los estilos anteriores que te he dicho en el archivo style.css, añade esto en el index.php justo después de la línea
    <div class=”entry”>
    <?php the_post_thumbnail(‘thumbnail’, array(‘class’ => ‘alignleft’)); ?>
    y después de
    <?php the_excerpt(__(‘Read more’));?> <br />
    <div class=”aligncenter”></div>

    Si quieres que la imagen también aparezca en el single.php
    añade justo antes de
    <?php the_content(); ?>
    <?php the_post_thumbnail(‘thumbnail’, array(‘class’ => ‘alignleft’)); ?>

    Posiblemente los márgenes superior e inferior los tengas que aumentar, ponlos todos a 14 px si quieres.

    OJO, no copies y pegues desde el Foro, porque las comillas son diferentes.

    Un saludo

  • #68444

    Alias79
    Participante

    Acabo de editarlo y lo añade, pero al tamaño completo de la imagen, no a los 115 px que puse en el archivo functions. Lo mismo he hecho algo mal ¿?

    Las imágenes que tengo subidas a 494 de ancho (las que subo sueltas casi siempre las subo a ese tamaño, ya que es el ancho de mi theme) se ven bien, pero las más grandes se salen:

    http://i48.tinypic.com/u95ia.png

    Es raro, tendría que coger los 115 que tengo predefinidos, no? En las otras pruebas (las imágenes que he puesto antes) si se veían a ese tamaño.

  • #68446

    LGrusin
    Miembro

    Pues si que es raro, ¿Qué diferencias hay con lo que tenías? Si configuras el tamaño de las imágenes en Ajustes – Media no tienes que poner nada en el functions.php

    De hecho esto debería funcionar:
    <?php the_post_thumbnail(array(120, 100), array(‘class’ => ‘alignleft’)); ?>
    siendo 120 100 las medidas de la imagen

  • #68447

    Alias79
    Participante

    Perdona, no puse bien el código (por eso las imágenes aparecían debajo). Ahora si lo he puesto bien, lo que la imagen sigue saliendo en tamaño grande:

    http://i50.tinypic.com/2d7d4ph.png

    Estoy realizando los cambios en una copia de la plantilla para pruebas que ejecuto con Theme Test Drive; voy a cambiarla por la normal para que lo puedas ver mejor:)

  • #68449

    Alias79
    Participante

    Acabo de pegar el nuevo código (después de <div class=”entry”>) y me aparece como antes, me refiero a con la pequeña imagen arriba y el texto abajo (ahora tengo aplicada esa plantilla)

  • #68450

    LGrusin
    Miembro

    Eso he dicho, después de class=”entry”…

    ¿Has puesto en el style.css lo que puse antes? Sin eso no alinea las imágenes ni los thumbnails.

    Revisa todo bien y con calma…

    Esas comillas que te estoy viendo… 😉

    Saludos

  • #68451

    Alias79
    Participante

    Ummm… Pues no se que puede estar mal ¿?

    Mira, esto es justo lo que tengo en ese apartado:

    <div> class=”entry”>
    <?php the_post_thumbnail(array(120, 100), array(‘class’ => ‘alignleft’)); ?>
    <?php the_excerpt((‘Read more’));?> <br />
    <div class=”aligncenter”></div>

  • #68452

    Alias79
    Participante

    El código del Style.css lo pegué justo al final del archivo. Es ahí, no?

  • #68453

    LGrusin
    Miembro

    Lee otra vez bien, porque nos estamos haciendo un lio al contestar al mismo tiempo…

    Posiblemente las comillas esto no es lo mismo que esto "

    ni esto es lo mismo que esto '

    Ya sé que es un coñazo pero WordPress las cambia al escribirlas en el Foro

  • #68454

    Alias79
    Participante

    Malditas comillas!!! jejeje, perdona, es algo que siempre se me olvida 🙁

    Pues si, iba a ser eso :D, ahora ya se ve tal y como quería (jugaré un poco más con los tamaños para dar con el adecuado). Muchas gracias!!!

    Sólo una cosa más: se puede hacer que estas miniaturas tengan algún tipo de borde? Es que se ven un poco desnudas 🙂

  • #68455

    LGrusin
    Miembro

    Ah, no te había leído, pensé que habías terminado… 😉

    Pues si, sigue añadiendo al style.css

    img.alignleft, img.alignright, img.aligncenter {
    border: 5px solid #eee;
    }

    Saludos

  • #68456

    Alias79
    Participante

    Perfecto, eres un máquina LGrusin!!!

    Lo malo es que no se ve de primeras por la caché del navegador (los usarios lo verán mal en un principio, lástima que no se pueda forzar), pero limpiándola o entrando en modo incognito si se ve todo cuadrado, perrrrfecto!!

    De nuevo, muchas gracias por todo amigo!!

  • #68458

    antoniohg
    Participante

    Con esos estilos que te dió LGrusin y ese código de las entradas debería funcionar

  • #68459

    antoniohg
    Participante

    Anda que ya funciona, no había leido la segunda página 😉

  • #68460

    Alias79
    Participante

    Sí, todo está perfecto antoniohg!! 😀

El foro ‘Themes y Diseño’ está cerrado y no se permiten nuevos debates ni respuestas.

Pin It on Pinterest

Ir al contenido