Title: Using custom image files
Last modified: March 26, 2019

---

# Using custom image files

 *  Resolved [lococola](https://wordpress.org/support/users/lococola/)
 * (@lococola)
 * [7 years, 2 months ago](https://wordpress.org/support/topic/using-custom-image-files/)
 * This may be incredibly basic, but I’m having problems figuring out how to use
   my own images as buttons under posts. I have some PNG files that I want to use
   as buttons, but I can’t figure out how to get that working.
 * I am not using FontAwesome, so I have disabled those 2 options. And I am using
   the manual option in combination with a shortcode.
 * This gives me 4 small grey squares under each post. But how to replace those 
   for my images? I have tried it with CSS but it seems very cumbersome. Wondering
   if there is an easier way.
 * Thanks!

Viewing 4 replies - 1 through 4 (of 4 total)

 *  Plugin Author [Robin Cornett](https://wordpress.org/support/users/littlerchicken/)
 * (@littlerchicken)
 * [7 years, 2 months ago](https://wordpress.org/support/topic/using-custom-image-files/#post-11357096)
 * You should be able to do this with CSS–yes, it will be a bit repetitive as you
   need to add rules for each button, but I got it working roughly with this:
 *     ```
       .scriptlesssocialsharing-buttons .button:before {
       	display: inline-block;
       	vertical-align: middle;
       	content: ' ';
       	height: 20px;
       	width: 20px;
       	background-size: 20px;
       }
   
       .scriptlesssocialsharing-buttons .facebook:before {
       	background-image: url(path-to-your-image);
       }
       ```
   
 * It’s pretty similar to the default plugin style, styling the `:before` pseudo
   element. You could also add the background to just the button itself, but that
   seemed to require more work. HTH
 *  Thread Starter [lococola](https://wordpress.org/support/users/lococola/)
 * (@lococola)
 * [7 years, 2 months ago](https://wordpress.org/support/topic/using-custom-image-files/#post-11357168)
 * Hi Robin,
 * thank you, this is much more elegant than my CSS experiments thus far. It’s working
   nicely now and looks great. Thank you for the quick support! 🙂
 *  [highchairsociety](https://wordpress.org/support/users/highchairsociety/)
 * (@highchairsociety)
 * [6 years, 9 months ago](https://wordpress.org/support/topic/using-custom-image-files/#post-11888121)
 * Hi there, I tried using this but it isn’t working for me. It looks like the element
   names may have changed a bit, so I tried adapting myself but haven’t been able
   to get it to work. Any advice is much appreciated, thank you!
 * Megan
 *  Plugin Author [Robin Cornett](https://wordpress.org/support/users/littlerchicken/)
 * (@littlerchicken)
 * [6 years, 9 months ago](https://wordpress.org/support/topic/using-custom-image-files/#post-11888692)
 * If you are using the new flexbox display option, which I think is preferable,
   the container class is now `scriptlesssocialsharing__buttons` (double underscore
   instead of the hyphen), so that may be what’s missing.

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Using custom image files’ is closed to new replies.

 * ![](https://ps.w.org/scriptless-social-sharing/assets/icon-256x256.jpg?rev=1361689)
 * [Scriptless Social Sharing](https://wordpress.org/plugins/scriptless-social-sharing/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/scriptless-social-sharing/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/scriptless-social-sharing/)
 * [Active Topics](https://wordpress.org/support/plugin/scriptless-social-sharing/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/scriptless-social-sharing/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/scriptless-social-sharing/reviews/)

 * 4 replies
 * 3 participants
 * Last reply from: [Robin Cornett](https://wordpress.org/support/users/littlerchicken/)
 * Last activity: [6 years, 9 months ago](https://wordpress.org/support/topic/using-custom-image-files/#post-11888692)
 * Status: resolved