Themes y Diseño

Foro WordPress » WordPress » Themes y Diseño

CSS color de los títulos de las entradas (17 mensajes)

Acerca de este hilo

Tags

Etiquetas:

No hay tags todavía.

  1. fum

    5.0
    Antiguedad: Feb 2009
    Mensajes: 390

    offline

    Publicado hace 1 año
    #

    Hola, por prueba y error pude ir modificando la plantilla de CSS de mi tema en casi todo lo que quise, pero no logro cambiar el color de los títulos de las entradas, no identifico el código que le corresponde.

    Agradezco toda ayuda para identificarlo. El tema es Andreas09 Ciber Press
    El blog es este.

    Saludos!

  2. Pedro Raul

    5.0
    Antiguedad: Ene 2010
    Mensajes: 812

    offline

    Publicado hace 1 año
    #

    black2.css (línea 5)

    a{color: #4E4E4E}

    añade después

    h2.post a {color:tucolor;}

    Wordpresslatino.net: ¡Se Brinda ayuda gratis para tu wordpress! -->- CLICK EN MI NICK
    ¡quieres que lo HAGA por ti! ---> CLICK EN MI NICK
  3. fum

    5.0
    Antiguedad: Feb 2009
    Mensajes: 390

    offline

    Publicado hace 1 año
    #

    Gracias Pedro Raúl, así lo hice pero los títulos no camian, te copio como quedó por si cometí algún error:

    a {
    color:#4E4E4E;/*color tipografía títulos de entradas y enlaces, RSS, Admin*/
    h2.post a {color:#ff6600;}
    }

  4. fum

    5.0
    Antiguedad: Feb 2009
    Mensajes: 390

    offline

    Publicado hace 1 año
    #

    Agregando esa línea no cambia el color. Si cambia desde la línea de arriba:

    color:#4E4E4E;/*color tipografía títulos de entradas y enlaces, RSS, Admin*/

    pero también cambia el color de los enlaces, RSS y otras cosas, como alguna vez escribé en el comentario al lado del color, la cuestión sería que solo cambien los títulos de las entradas, habrá algún de talle equivocado que no reconoce la línea que sugiere Pedro Raúl?

    Gracias, salus.

  5. fliberty

    5.0
    Antiguedad: Oct 2009
    Mensajes: 1.511

    offline

    Publicado hace 1 año
    #

    Al colocar el estilo
    a{color:tucolor}

    estás aplicando el estilo a todos los enlaces

    En todo caso si quieres aplicar formato a los enlaces de encabezado H2, puedes hacer lo siguiente:
    h2 a {color:tucolor}

    o en todo caso puedes hacer el formato de esta forma:

    h2.post a{color:tucolor}

    ó .post h2 a{color:tucolor}

    Estos dos últimos formatos buscan todos los encabezados que sean enlaces y les cambia el color; pero este último busca un class="post" luego un H2 y finalmente que sea un enlace (es lo mismo que el anterior, pienso).

    Visítenme:
    http://www.contigoperu.com.pe (hosting/dominios) | http://www.pachakamaq.com (temática variada) | http://www.mipycs.com (image hosting gratuito) | http://www.contigoperusemanario.org(noticias) | http://www.contigoperuclasificados.com (clasificados gratis) | http://www.cyberdocentes.com (recursos educativos)
  6. fum

    5.0
    Antiguedad: Feb 2009
    Mensajes: 390

    offline

    Publicado hace 1 año
    #

    Gracias Fliberty, pero ni modo cambia siempre títulos y enlaces juntos, la línea de abajo no suerte efecto en ninguna de los modos propuestos.¿?

  7. Pedro Raul

    5.0
    Antiguedad: Ene 2010
    Mensajes: 812

    offline

    Publicado hace 1 año
    #

    pues te has equivocado.

    debería quedarte así:
    fíjate en los cierres de las llaves.

    a{color: #4E4E4E}
    h2.post a {color:tucolor;}

    este código que has puesto:

    a {
    color:#4E4E4E;/*color tipografía títulos de entradas y enlaces, RSS, Admin*/
    h2.post a {color:#ff6600;}
    }

    Wordpresslatino.net: ¡Se Brinda ayuda gratis para tu wordpress! -->- CLICK EN MI NICK
    ¡quieres que lo HAGA por ti! ---> CLICK EN MI NICK
  8. fum

    5.0
    Antiguedad: Feb 2009
    Mensajes: 390

    offline

    Publicado hace 1 año
    #

    Pedro Raúl, creo que entendí como funcionan las llaves, copié y pegué el código que enviaste pero no funcionó. Por las dudas en la línea para los títulos probé con el código que envió Fliberty y...

    (Trompetas!) FUNCIONÖ!!!

    Muchas gracias a los dos, hace meses que quería hacer esto!
    Saludos!

  9. Pedro Raul

    5.0
    Antiguedad: Ene 2010
    Mensajes: 812

    offline

    Publicado hace 1 año
    #

    El código puede ensuciarse por el sistema foro, ya que se como alguna cosas y añade otras.

    Te sugiero que leas cerca de los selectores css y la forma en que funcionan.

    Wordpresslatino.net: ¡Se Brinda ayuda gratis para tu wordpress! -->- CLICK EN MI NICK
    ¡quieres que lo HAGA por ti! ---> CLICK EN MI NICK
  10. fum

    5.0
    Antiguedad: Feb 2009
    Mensajes: 390

    offline

    Publicado hace 1 año
    #

    Quizás se haya ensuciado el código al cortar y pegar, no lo pensé, en concreto lo que funcionó quedó así:

    a{color: #4E4E4E}/*color de los enlaces*/
    .post h2 a{color:#f76005}/*color de los títulos de las entradas*/

    agregué los comentarios por que dentro de un tiempo ya no podría identificarlo.
    Claro que me vendría bien leer sobre CSS, pero ya que estamos una pregunta: como no tengo ningún conocimiento por dónde empiezo, de algún lado saqué que antes que nada debería comprender el HTML y luego avanzar sobre PHP y CSS, o no es tan así?

    Gracias otra vez.

  11. sanguango

    1.0
    Antiguedad: Mar 2011
    Mensajes: 4

    offline

    Publicado hace 1 año
    #

    Hola, tengo el mismo problema que FUM tenía. He tratado de seguir las indicaciones que aquí sugieren pero no logro resolverlo. Quiero que los titulos de mis entradas y los enlaces que se encuentran en el texto de mis entradas sean diferentes. Actualmente tengo este codigo en mi hoja de estilos:

    /***************POST STYLES*************************/

    .post h2 {

    /*  background: url(images/h2.png) no-repeat scroll top;*/

    padding-top:10px;

      width: 640px;

      margin-left: 0px;

      font-weight:bold;

      color:#780000;

    }

    *+html .post h2 {

      margin-left: 0px;

      margin-bottom: 4px;

    }

    #contentwrap1 .post h2 {

    /*  background: url(images/h21.png) no-repeat scroll top;*/

      width: 410px;

      color:#780000;

    }

    .post

     a , post h2 a:visited {

      color: #101010;

      font-size: 13px;

      color:#780000;

      padding-left:0px;

    }

    .post h2 a:hover {

    color:#330000;

    }

    .meta {

      background: #ffffff;

      padding: 0px;

    }

    .cat {

        font-size:10px;

        text-transform: uppercase;

    }

    .cat a{

    font-size:10px;

    text-transform: uppercase;

    }

    .fecha{

    font-size:10px;

    text-transform: uppercase;

    color:#999999;

    }

    .author {

    font-size:10px;

    text-transform:uppercase;

    color:#999999;

    }

    .edit {

    font-size:10px;

    text-transform:uppercase;

    }

    .edit a{

    font-size:10px;

    }

    .comm {

    font-style:italic;

    font-size:10px;

    }

    a.more-link {

      /*background: url(images/more.png) no-repeat;*/

      padding: 1px 4px 6px 4px;

      color: #000;

      font-size: 10px;

      float: right;

    }

    .postmetadata {

      margin-top: 15px;

      padding-bottom: 15px;

      font-size:10px;

    }

    .post {

        height: 1%;

        padding-top: 0;

        padding-right: 10px;

        padding-bottom: 5px;

        padding-left: 10px;

    }

    #contentwrap1 .post {

      /*background: url(images/posty1.png) repeat-y;*/

    }

    .pbot {

    /*  background: url(images/pbot.png) no-repeat scroll bottom;*/

      margin-bottom: 15px;

      padding-bottom: 10px;

      border-bottom:solid 1px #CCCCCC;

    }

    #contentwrap1 .pbot {

    /*  background: url(images/pbot1.png) no-repeat scroll bottom;*/

    }

    .entry {

      margin-top: 20px;

      line-height: 20px;

      text-align: left;

      position: relative;

    }

    Muchas gracias de antemano!

  12. Pedro Raul

    5.0
    Antiguedad: Ene 2010
    Mensajes: 812

    offline

    Publicado hace 1 año
    #

    url del blog

    Wordpresslatino.net: ¡Se Brinda ayuda gratis para tu wordpress! -->- CLICK EN MI NICK
    ¡quieres que lo HAGA por ti! ---> CLICK EN MI NICK
  13. Pedro Raul

    5.0
    Antiguedad: Ene 2010
    Mensajes: 812

    offline

    Publicado hace 1 año
    #

    esta es el selector que debe manipular.

    style.css (línea 921

    .post a, post h2 a:visited {
    color: #780000;
    font-size: 13px;
    padding-left: 0;
    }

    Wordpresslatino.net: ¡Se Brinda ayuda gratis para tu wordpress! -->- CLICK EN MI NICK
    ¡quieres que lo HAGA por ti! ---> CLICK EN MI NICK
  14. sanguango

    1.0
    Antiguedad: Mar 2011
    Mensajes: 4

    offline

    Publicado hace 1 año
    #

    Muchas gracias Pedro Raul. Veo que los valores que tu has puesto aquí y los valores que figuran luego de la linea 921 son un poco distintos. Debo ponerlos como tu has sugerido? O estoy entendiendo mal? Disculpa mi ignorancia, es que no tengo idea de programación, estoy tratando de hacer un esfuerzo para comprender. Qué es exactamente lo que debería agregar o modificar para que los titulos de mis entradas y los enlaces tengan un estilo diferente? Mil gracias

  15. fliberty

    5.0
    Antiguedad: Oct 2009
    Mensajes: 1.511

    offline

    Publicado hace 1 año
    #

    Primero en tu theme o visualizando el código fuente de tu página identifica el contenedor del título, normalmente este está dentro de <h2>

    Puede estar: [h2][a href="....."]titulo[/a][/h2]
    Anterior a esto busca la etiqueta que los contiene, normalmente <div class="post"> puede ir post, articulo, etc, que se yo o sea en el orden siguiente:

    < div class="post" >
    < h2 ><a href="url del titulo">Titulo de la web</a>< /h2 >
    .
    .
    .
    //Para el caso anterior el CSS sería:

    .post h2 a{
    color: #color;
    font: tamaño tipo de fuente;
    otros formatos;
    }

    Visítenme:
    http://www.contigoperu.com.pe (hosting/dominios) | http://www.pachakamaq.com (temática variada) | http://www.mipycs.com (image hosting gratuito) | http://www.contigoperusemanario.org(noticias) | http://www.contigoperuclasificados.com (clasificados gratis) | http://www.cyberdocentes.com (recursos educativos)
  16. sanguango

    1.0
    Antiguedad: Mar 2011
    Mensajes: 4

    offline

    Publicado hace 1 año
    #

    Fiberty, gracias por tu mensaje, pero sigo sin entender. Cual es la diferencia entre el codigo que tu sugieres y lo que actualmente ya se encuentra en la pagina:

    .post

     a , post h2 a:visited {

      color: #101010;

      font-size: 13px;

      color:#780000;

      padding-left:0px;

    Este codigo tambien se refiere a

    post h2 a

    o no? Si fueras tan amable de decirme: mira, borra esto y agrega aquello; creo que va a ser mucho mas facil porque no entiendo nada de programacion.

    Disculpas y gracias por la ayuda

  17. fliberty

    5.0
    Antiguedad: Oct 2009
    Mensajes: 1.511

    offline

    Publicado hace 1 año
    #

    Para saber exactamente cuál es el contenedor de tu título, tendrías que dejarnos la URL de tu web.

    Lo que te mencionaba era lo siguiente, por ejemplo acceso al código fuente de mi página y busco la parte donde se menciona el título del artículo, y no fijo sólo en el título si no también en sus contenedor superior; en el caso de mi página (pachakamaq.com), el código del título tiene la siguiente forma:

    < div class="post-title" >//aqui se abre el contenedor del título
                     < h2 ><a href="http://www.pachakamaq.com/step-step-wire-jewelry-winter-2007-vol2.html" title="Step by Step Wire Jewelry &#8211; Winter 2007 Vol2">Step by Step Wire Jewelry &#8211; Winter 2007 Vol2</a>< /h2 >//esta línea es la que nos interesa
                        < span class="post-edit" >< /span >
                        < div class="clear" >< /div >
                    < /div >//y aqui se cierra el contenedor del título

    La primera línea es el contenedor del título, se define por la clase post-title (esto varía según la programación de tu web).
    En la segunda línea empieza el título, con un encabezado H2, seguido del enlace "a href", sigue el contenido del título (anchor text), se cierra la etiqueta de enlace, se cierra el encabezado H2, y siguen otros contenedores con las clases post-edit y clear, que para el ejemplo no vienen al caso.

    A nosotros en este caso lo que nos importa son las líneas anteriores, si tenemos en cuenta esto el orden para aplicar el formato CSS sería: .clase encabezado enlace

    Teniendo como resultado:

    .post-title h2 a{
    color: #tucolor
    }

    Es decir, si en html tenemos que cerrar las etiquetas en el orden como las hemos abierto, en CSS tenemos que dar formato en el orden de las etiquetas asignadas en html.

    Espero que me hayas entendido.

    Visítenme:
    http://www.contigoperu.com.pe (hosting/dominios) | http://www.pachakamaq.com (temática variada) | http://www.mipycs.com (image hosting gratuito) | http://www.contigoperusemanario.org(noticias) | http://www.contigoperuclasificados.com (clasificados gratis) | http://www.cyberdocentes.com (recursos educativos)

Responder

Debes Identificarte para publicar.

Foro WordPress » WordPress » Themes y Diseño