• Hi,

    I am trying to change the size,font and color of different elements from my blog: https://www.cye-coaching.com. For instance:
    – 3 Highligthed Page Titles (3xcircles at main page)
    – Entry Titles on main page
    – Events Titles on main page

    I have added this code to the css tab:
    “h1,h2 {
    font-weight: bold;
    font-family: agency-fb;
    font-size: 20pt;
    color: #8A2BE2;
    }”

    I was able to change the ” 3 Highligthed Page Titles (3xcircles at main page)”, but I couldn’t get BOLD

    After it, I added this code:
    .entry-title {
    font-family: agency-fb;
    font-size: 16pt;
    color: #8A2BE2;
    }

    But I only could change the font and size… but no the color.

    What I am doing wrong?
    How can I change font characteristics for Events List on main page?

Viewing 10 replies - 1 through 10 (of 10 total)
  • Hello!

    Regarding the highlighted page titles (like the ‘Cursos de coaching y liderazgo’), your css rules are being overwritten. Try this:

    .marketing h2 {
      font-weight: bold;
    }

    Regarding the event lists, every event is in an <li> with the class of tribe-events-list-widget-events. You should try adding your css rules to that class. The event name is an h4 with the class of entry-title. But because it is an <a> link, if the above does not work, you could try targeting that with #main-wrapper .widget li a css selector. The time values you can target with .tribe-events-list-widget .duration

    I hope this helps. If you need some specific modifications, just tell me what you would like, and I can provide the necessary css.

    Greetings,
    Balint

    Thread Starter optoscar

    (@optoscar)

    Hello Balint,

    many thanks for your help.

    A couple of things worked great:

    1.- Bold at higlighted page titles! Perfecto!
    .marketing h2 {
    font-weight: bold;
    }

    2.- Time values at Event List, grat
    .tribe-events-list-widget .duration{
    font-family: agency-fb;
    font-size: 10pt;
    color: #8A2BE2;
    }

    But I still cannot target some elements:

    1.- Entry Titles. I am trying with this code:
    .entry-header .entry-title {
    font-family: agency-fb;
    font-size: 14pt;
    color: #8A2BE2;
    }
    It does change the size and font, but no the color.. ??

    2.- List Event Titles. I have tried different codes, for instance:
    .tribe-events-list-widget-events .entry-title{
    font-family: agency-fb;
    font-size: 11pt;
    color: #8A2BE2;
    }
    Again, I could change size and font, bt no the font color… ??

    What I am doing wrong with the font color?

    As I do not know too much about CSS, I can figure out how to target those elements.

    Thread Starter optoscar

    (@optoscar)

    Regarding your first answer:

    For both of them, try this:

    .entry-title a {
      color: #8A2BE2!important;
    }

    If you want one of them to be different color than the other, just let me know.

    Regarding your second answer, I am afraid I cannot understand what are you referring for, and for some reason for your Dropbox links I am getting a 404 error. Could you please check those?

    Thank You!
    Greetings,
    Balint

    Thread Starter optoscar

    (@optoscar)

    So far, I have changed everything I was requested to change ??

    So, thank you very much!

    The code I used for all the personalization is:

    h1,h2 {
    font-weight: bold;
    font-family: agency-fb;
    font-size: 20pt;
    color: #7A3F79;
    }
    
    .marketing h2 {
      font-weight: bold;
     }
    
    .tribe-events-list-widget .duration{
    font-family: agency-fb;
    font-size: 10pt;
    }
    
    .entry-header .entry-title {
    font-family: agency-fb;
    font-size: 14pt;
    color: #7A3F79;
    }
    
    .tribe-events-list-widget-events .entry-title{
    font-family: agency-fb;
    font-size: 11pt;
    }
    
    .entry-title a {
      color: #7A3F79!important;
    }

    Thanks again for your great help Balint

    ps: I will keep it unresolved for a while, until i try further personalizations.

    You are very welcome! I am glad that I could help you!

    If you need any more help, just drop a line here and I will assist you.

    Have a nice day!

    Balint

    Thread Starter optoscar

    (@optoscar)

    Hello again,

    I am experiencing again the same problem. I do my changes within WordPress Website (https://cye-coaching.com/wp-admin/customize.php) and there everything look OK:
    https://www.dropbox.com/s/cbsvczgzb2w1z4t/Captura%20de%20pantalla%202013-11-19%2015.44.07.png
    also when I click on the option to Visit Site (in spanish Visitar Sitio)
    https://www.dropbox.com/s/ixfvqknjpb14sz1/Captura%20de%20pantalla%202013-11-19%2015.47.37.png
    and i got the website as I define:
    https://www.dropbox.com/s/r6gjbpxwdumqb1c/Captura%20de%20pantalla%202013-11-19%2015.47.41.png

    But when I change to other browser (or even in the same one) I’ve got a completly different page:
    https://www.dropbox.com/s/hdc6ulnm3y0gzgw/Captura%20de%20pantalla%202013-11-19%2015.50.38.png
    also iexplorer:
    https://www.dropbox.com/s/q3uehfz985ooxnk/Captura%20de%20pantalla%202013-11-19%2015.51.41.png

    why is this happening?

    [Moderator Note: Please ensure that you are embedding links correctly in your posts.]

    Thread Starter optoscar

    (@optoscar)

    Sorry for the links, I am having some problems… here is again the same post more cleanear:

    “Hello again,

    I am experiencing again the same problem. I do my changes within WordPress Website (https://cye-coaching.com/wp-admin/customize.php) and there everything look OK:

    “Costumize Page at WordPress Website” https://www.dropbox.com/s/cbsvczgzb2w1z4t/Captura%20de%20pantalla%202013-11-19%2015.44.07.png

    also when I click on the option to Visit Site (in spanish Visitar Sitio)
    “Visit my Site option image” https://www.dropbox.com/s/ixfvqknjpb14sz1/Captura%20de%20pantalla%202013-11-19%2015.47.37.png

    and i got the website as I define:
    “Visiting my blog image”
    https://www.dropbox.com/s/r6gjbpxwdumqb1c/Captura%20de%20pantalla%202013-11-19%2015.47.41.png

    But when I change to other browser (or even in the same one) I’ve got a completly different page:

    “Comodo Browser image” https://www.dropbox.com/s/hdc6ulnm3y0gzgw/Captura%20de%20pantalla%202013-11-19%2015.50.38.png

    also iexplorer:

    “IExplorer image”
    https://www.dropbox.com/s/q3uehfz985ooxnk/Captura%20de%20pantalla%202013-11-19%2015.51.41.png

    why is this happening?

    Hello!

    Here is how the site looks like for me:

    https://d.pr/i/Pcp5

    But I think I know why is this happening. I have noticed that when you check the site from other browsers (where the site is not showing up as it should), you are not logged in to WordPress Dashboard. Try to log in to your site from one of those other web browsers, and I bet that the site will look like fine. ??

    Now, here is the trick: I have checked your site’s source code, and it suggests that you have some kind of caching plugin installed. Those plugins work in a way that they make a sort of snapshot of every page of your site, and if a visitor comes, the plugin shows the visitor that snapshot, because it is faster. Depending on your settings, those snapshots can be pretty old, in some cases even a day old. Those plugins recreate those snapshots (the cache) when you are modifying something to the page’s content. They have no way telling that you are changing the theme’s css rules, thus, they are not showing the actual state of the site. The trick with the login is: usually most caching plugins are set up so if someone has login access to the site, than that person must be someone important, so no matter what, he should get the most up to date data from the site, so for the logged in users there is no caching going on. The other reason is, while your site could have 1000 or even more visitors (who are not logged in), usually there is a little amount of users with login privileges, so it is not noticable if the cache is not applied to them.

    My advice is, it is completely unnecessary to use a caching plugin until you have that amount of visitors that your site is getting slow. And for the time period when you tweaking something to your site, it is the best to turn off caching for everyone, because this way you can ensure that in every second you are seeing the actual and real state of the site.

    So deactivate the caching plugin, or click on recreate/rebuild cache.
    Let me know if that solved the problem.

    Greetings,
    Balint

    Thread Starter optoscar

    (@optoscar)

    I have deactivated and removed all the cache plugins.
    And now everything works fine and changes are automatically seen at the website.

    Million thanks for your help and time!

    Best Wishes.

    Oscar.

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘Entry Title Fonts: Size and Color’ is closed to new replies.