Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1344375

    Hi I would need to customize the buttons icons on my page https://www.medicalverso.com/metaplace/. I have read that it is possible to do this via fontello or flaticon, is there not the possibility of using icons created by me?

    #1344390

    Hey sitibus,
    I assume that you have read our documentation about Adding your own Fontello or Flaticon Icons, you can create your own icons in SVG format single color only (black) and upload them to fontello which will convert them to a icon font which then can be imported to the Iconfont Manager.
    Your other option would be to create an image icon and use css to replace the current icon font in the button, like this:

    #top.page-id-1152 .avia_button_icon_left:before {
      content: url(https://img.icons8.com/fluency/30/000000/idea.png)!important;
    }
    #top.page-id-1152 .avia_iconbox_title {
    	top: -8px;
    }

    2022-03-14_001.jpg

    Best regards,
    Mike

    #1344490

    Tks Mike,
    the workaround that you suggested me works good as you can see at https://www.medicalverso.com/metaplace/ but would it be possibile the have 3 different icons, one for each button?
    Otherwise I consider the idea of working with Fontello
    Tks
    Gianluca

    #1344523

    Hi Gianluca,

    You can add different icons if you assign an ID or class to either the 1/3 element, or the button, in the Advanced->Developer Settings tab. Then you can use CSS like this, if you are using an ID:

    #your-custom-id .avia_button_icon_left:before {
      content: url(https://img.icons8.com/fluency/30/000000/idea.png)!important;
    }

    Best regards,
    Rikard

    #1344542

    Wonderful I understood, can you only suggest me a default size for the “new” icons?

    #1344561

    Hi,
    It depends on where you want to use them, for these buttons it was 30px, but the 1/3 column icons on your frontpage are 90px, you can make them larger and scale them down by setting the height & width in the css.

    Best regards,
    Mike

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.