Viewing 27 posts - 1 through 27 (of 27 total)
  • Author
    Posts
  • March 3, 2020 at 9:40 pm #1189832
    elenagrassi

    Hallo,
    I am working on my new website by personalizing your Health Coach demo. I would like to change the background color of the breadcrumbs to white. It is now green (see sample page). I haven’t been able to find how to do that.
    Also, I would like to reduce the font size in the icon boxes, in the same page as above, scrolling down.

    Can you help?
    Thank you

    March 4, 2020 at 8:51 am #1189951
    Rikard

    Hey Elena,

    Please try this for the breadcrumbs:

    .title_container {
  background-color: red;
}

    And this for the iconbox:

    .iconbox_content_container p {
  font-size: 12px;
}

    Best regards,
    Rikard

    March 4, 2020 at 11:57 am #1190003
    elenagrassi

    That works, thank you!

    Can I also ask you:

    – how to reduce the font size of the icon box title
    – move the breadcrumbs to the left margin (I think I saw that option somewhere but I cannot find it anymore :( )
    – riduce the height of the breadcumbs space

    Many thanks
    Elena

    March 4, 2020 at 7:46 pm #1190190
    Victoria

    Hi Elena,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
#top #wrap_all .all_colors h3.iconbox_content_title {
    font-size: 18px;
}
#top .title_container .container {
    min-height: 45px;
}
#top .title_container .breadcrumb {
    right: auto;
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    March 4, 2020 at 9:13 pm #1190240
    elenagrassi

    Thank you so much. It worked great!

    Well, yes, I have another question:
    I was wondering how I could find more icons for the icon boxes and upload them into the theme. The icons that are already there are not suitable for the services I offer.

    Elena

    March 5, 2020 at 7:17 pm #1190586
    Victoria

    Hi Elena,

    Here are the docs for you:

    Icon

    If you need further assistance please let us know.
    Best regards,
    Victoria

    March 9, 2020 at 8:29 pm #1191632
    elenagrassi

    Thank you,

    I have uploaded a set of Flaticon icons. Unfortunately, one single set does not cover all my needs, but if I try to upload a second set of icons, the first one is cancelled. Is it possible to upload just one?

    Elena

    March 10, 2020 at 6:40 pm #1191972
    Victoria

    Hi Elena,

    You need to rename the file of the second set and so it will be uploaded too :)

    If you need further assistance please let us know.
    Best regards,
    Victoria

    March 11, 2020 at 1:17 pm #1192254
    elenagrassi

    Hi Victoria,

    well, the zip files do have different names already when I download them. When I go to Enfold>import/export>upload/choose Fontello font zip, it lets me choose just one of the sets that are in the media library. If I try to upload a second one, nothing seems to happen and the font packs shown in the iconbox remain three (the standard one, the lifestyles one that was included in the demo, and the first one Flaticon pack I added). Sometimes, when I try to upload a secon pack, part of the icons of the first Flaticon icon pack don’t even show anymore. Maybe I am doing something wrong? I enclose a few screenshots, hope they help.
    Enfold import/export page
    icon packs media library
    Icon box fonts

    March 11, 2020 at 5:05 pm #1192358
    Victoria

    Hi elenagrassi,

    Can you give us temporary admin access to your website in the private content box below, so that we can have a closer look?

    Best regards,
    Victoria

    March 11, 2020 at 5:33 pm #1192375
    elenagrassi

    HI,
    here you are

    March 11, 2020 at 5:46 pm #1192385
    Victoria

    Hi elenagrassi,

    The files inside say “flaticon” and so it shows that it uploaded flaticon, can you please share the link where you downloaded the icons.

    Best regards,
    Victoria

    March 11, 2020 at 5:59 pm #1192386
    elenagrassi

    Hi Victoria,

    the links are:
    https://www.flaticon.com/packs/dogs
    https://www.flaticon.com/packs/dog-and-training
    https://www.flaticon.com/packs/veterinary-3

    Best regards,
    Elena

    March 13, 2020 at 4:23 pm #1192910
    elenagrassi

    Hallo,
    I haven’t heard back from you…
    I was trying to understand how to change the name of the file that appears under Enfold>Import/Export>Upload/select Fontello font zip.
    Even if the name of the zip files are different, when I upload each of them it always says “Font: flaticon” and nothing else there. I watched the video in the documentation page you linked but it just says the name can be changed and customized in the Fontello site but does not say how and does not show how to use the Flaticon icon packs.
    Thank you for your help
    Elena

    March 15, 2020 at 8:10 pm #1193267
    Victoria

    Hi Elena,

    I uploaded the zip to my machine and I saw flaticon in the import and then I realized, in the zip all the font files have the name of flaticon and so the. uploaded just replaces them, you need to go to the zip and rename all those files to “dogs” for example, like dogs.woff, zip the folder again and upload it
    Image 2020-03-15 at 20.07.37.png

    If you need further assistance please let us know.
    Best regards,
    Victoria

    March 16, 2020 at 11:47 am #1193445
    elenagrassi

    Hi Victoria,
    I have done what you say and changed all the names in the “font” folder in the three icon packs I downloaded and then zipped the files again and imported them into Enfold. But nothing changes. When I import a second icon pack into Enfold, it replaces the first one and the name that appears in Enfold Import is always just “flaticon” and the same in the iconbox in the editor.

    icon font files

    Elena

    • This reply was modified 4 years, 9 months ago by elenagrassi.
    March 16, 2020 at 8:34 pm #1193616
    Victoria

    Hi Victoria,

    Thank you. It is doing the same on my end. I’ll ask devs to have a look.

    Best regards,
    Victoria

    March 23, 2020 at 12:27 pm #1195439
    elenagrassi

    Hallo,
    any news from the devs?
    I need to solve the issue or find another solution.
    Thank you
    Elena

    March 26, 2020 at 2:02 pm #1198023
    Victoria

    Hi Elena,

    It is an open issue at the moment, it does not get resolved so quickly, unfortunately.

    Can you not find the same icons in fontello?

    Best regards,
    Victoria

    March 27, 2020 at 5:53 pm #1198387
    elenagrassi

    Well, no.
    As far as I can see, the choice of icons on the Fontello website is quite limited, and they are very general. There are hardly any animals there (I have found just one dog).
    By the way, the Health Coach demo contains a set of icons called lifestyles. Where do those come from?
    Best regards,
    Elena

    April 10, 2020 at 6:16 am #1202578
    Ismael

    Hi,

    You can also get icons from flaticon, but only flat and monocolored ones. You can upload colored icons but they will just be flattened and the colors will be removed.

    Best regards,
    Ismael

    April 10, 2020 at 7:41 am #1202593
    elenagrassi

    Yes, but, as I was discussing with VIctoria, the problem is that I cannot upload more than one single set of Flaticon icons

    April 13, 2020 at 10:35 am #1203262
    Ismael

    Hi,

    Yes, that is one of the limitations of the uploader. You can only upload a single set of icons.

    Best regards,
    Ismael

    March 18, 2022 at 2:50 pm #1345092
    Intell

    Hello, I appreciate this post. I have a client who wants a different color background for the title container for each page.
    How would I modify this code to do that? One of the page’s ID is 73
    They want this hideous color as the background for that page #A78F4F
    Also – is there a setting somewhere so the bread crumb is on the left instead of align right?
    Thank you!!

    .title_container {
  background-color: red;
}
And this for the iconbox:

.iconbox_content_container p {
  font-size: 12px;
}
    • This reply was modified 2 years, 9 months ago by Intell.
    March 19, 2022 at 9:26 pm #1345216
    Mike

    Hi,
    If your Page ID is 73 then use this css to change the title bar background color:

    #top.page-id-73 .title_container {
  background-color: #A78F4F;
}

    If your Post ID is 73 then use this css:

    #top.postid-73 .title_container {
  background-color: #A78F4F;
}

    To have the breadcrumbs on the left use this css:

    #top.postid-73 .title_container .breadcrumb {
    left: 50px;
}

    and adjust for either Post or Page
    After applying the css, please clear your browser cache and check.

    Best regards,
    Mike

    April 3, 2022 at 12:27 pm #1347047
    Intell

    This worked brilliantly!! Thank you sooooo much!

    April 3, 2022 at 1:30 pm #1347053
    Mike

    Hi,
    Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

    Best regards,
    Mike

  • Author
    Posts
Viewing 27 posts - 1 through 27 (of 27 total)
  • The topic ‘changing breadcrumbs background color and font size in the icon boxes’ is closed to new replies.