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

    Hi,

    I am trying to use different icons to what is being generated for the icon button shortcodes.

    Theme docs say to :add more icons to the /images/icons folder. but I have done this and they do not show up in the editor.

    btw, if I add an icon into the /images/icons/iconbox folder, it works but only for icon boxes.

    Any ideas?

    #70013

    Hi,

    We are going to create an “APPLY” button for exercise. You can use any png image with an icon size. Put the image on images > icons and name it “apply”.

    On framework > php > avia_shortcodes > sc, look for button.js.

    On the fourth row add this line.

    label:"Style",
    id:"style",
    help:"Values: <empty>, info, alert, tick, download, note, help, error, apply",
    controlType:"select-control",
    selectValues:['', 'info', 'alert', 'tick', 'download', 'note', 'help', 'error', 'apply'],
    defaultValue: '',
    defaultText: 'none (Default)'

    Notice that we add apply on “help” and “selectValues”

    Then go to css > shortcodes.css and look for /*Inline Links with icon*/ comment. Add this two lines.

    .avia-button .avia-apply{ background: transparent url("../images/icons/apply.png") no-repeat center left; padding: 2px 0 2px 22px; left:-2px;}

    .avia-ilink .help{ background: transparent url("../images/icons/apply.png") no-repeat center left; }

    Make sure that the file extension for the images is correct. In our case we use png image.

    Try to reload dashboard and enjoy. To add different buttons just do the instructions again. Hope this helps. :)

    Regards,

    Ismael

    #70014

    Thanks for that Ismael,

    Just wondering if there is a way to do this in a child theme?

    At the moment, I use a child theme so that when there is a theme update I don’t lose my css customisations. I know that I can add the css to my child theme css, but not so sure about the Framework > php > avia_shortcodes > sc, look for button.js files.

    Could I put this is a functions.php file in my child theme folder?

    Thank

    #70015

    Hi reganfrank,

    You should be able to save buttons.js in your child theme like you would your custom stylesheet. Just be sure to use the same hierarchy so you would create the folders framework > php > avia_shortcodes > sc then paste your button.js folder inside the sc folder.

    Regards,

    Mya

    #70016

    @Mya

    Thanks a stack, that really helps.

    Regards, Regan

    #70017

    Glad that helped!

    Let us know if you need anything else :)

Viewing 6 posts - 1 through 6 (of 6 total)

The topic ‘Add more icons to icon buttons shortcode’ is closed to new replies.