Title: Adding space between images Last modified: August 31, 2016 --- # Adding space between images * [CF](https://wordpress.org/support/users/ottaviano/) * (@ottaviano) * [10 years ago](https://wordpress.org/support/topic/adding-space-between-images/) * I have installed the plugin and set everything up on Facebook. I can currently seen the Instant Articles in the Pages manager app on iOS. * There is just one problem all my images come right after one another with no spacing between them. * I run a photography blog, so I normally have text and then end the post with a bunch of images. * On my website it is set up to render the images in figure tags with no p tags around them. I then use CSS on the website to give a margin bottom to the figure elements. * How can I make it so I have margin-bottom in the Facebook Instant Articles? * [https://wordpress.org/plugins/fb-instant-articles/](https://wordpress.org/plugins/fb-instant-articles/) Viewing 12 replies - 1 through 12 (of 12 total) * [riccarbi](https://wordpress.org/support/users/riccarbi/) * (@riccarbi) * [9 years, 11 months ago](https://wordpress.org/support/topic/adding-space-between-images/#post-7434857) * I have exactly the same problem. When converted to IA, all images lose the margins which usually separate them; due to this my articles are not validated. I tried to force a larger margin in CSS both for img and paragraph, but it seems to have no effects on the IA side. * Thread Starter [CF](https://wordpress.org/support/users/ottaviano/) * (@ottaviano) * [9 years, 11 months ago](https://wordpress.org/support/topic/adding-space-between-images/#post-7434858) * I found a solution. If you make the images available for Facebook comments and likes it will add a bottom margin to them. * Just add the following inside the opening figure tag of each image * `data-feedback="fb:likes, fb:comments"` * [riccarbi](https://wordpress.org/support/users/riccarbi/) * (@riccarbi) * [9 years, 11 months ago](https://wordpress.org/support/topic/adding-space-between-images/#post-7434859) * Thank you so much Michael! Just wondering where you should put this code: in WordPress or in an IA configuration file? * [riccarbi](https://wordpress.org/support/users/riccarbi/) * (@riccarbi) * [9 years, 11 months ago](https://wordpress.org/support/topic/adding-space-between-images/#post-7434861) * Just tried to add the following code both to the “custom rules” section of the plugin and directly in rules-configuration.json; re-saved the post but nothing happens; IA code still missing the data feedback lines. Very strange, indeed * { “rules”: [{ “class”: “ImageRule”, “selector” : “figure”, “properties” : { “ image.url” : { “type” : “string”, “selector” : “img”, “attribute”: “src” }, “ image.like” : { “type” : “exists”, “selector” : “figure[data-feedback*=’fb:likes’]”,“ attribute”: “data-feedback” }, “image.comments” : { “type” : “exists”, “selector”:“ figure[data-feedback*=’fb:comments’]”, “attribute”: “data-feedback” } } } * ] } * [riccarbi](https://wordpress.org/support/users/riccarbi/) * (@riccarbi) * [9 years, 11 months ago](https://wordpress.org/support/topic/adding-space-between-images/#post-7434864) * OK, got it partially work by adding the code in the custom rules box of the plugin. Yet it is clearly a workaround and it doesn’t work for all images (dunno why). It’s clearly a problem of translation from WP to IA, the translator completely removes CSS styling and, when you have images without any text between them, produces a series of
tags without anything in between. There should be some kind of fix for that, other than artificially forcing some content between images. * Thread Starter [CF](https://wordpress.org/support/users/ottaviano/) * (@ottaviano) * [9 years, 11 months ago](https://wordpress.org/support/topic/adding-space-between-images/#post-7434865) * I have been editing the posts on the Facebook side and manually changing the code, but I will give this a try next week and see if it works for me. * [riccarbi](https://wordpress.org/support/users/riccarbi/) * (@riccarbi) * [9 years, 11 months ago](https://wordpress.org/support/topic/adding-space-between-images/#post-7434866) * OK, I was wrong. The code is still not working, I was looking at the versions produced by Allfacebook Instant Articles (which has the option to include or nor the feedback from the interface….). Adding the code manually to each image works like a charm; yet, it is obviously not suitable for a production site with 3,000 articles like mine… * [riccarbi](https://wordpress.org/support/users/riccarbi/) * (@riccarbi) * [9 years, 11 months ago](https://wordpress.org/support/topic/adding-space-between-images/#post-7434869) * Woks like a charm? Not at all. If you update the original post all the manual correction you made in FB are gone…. I guess this plugin still needs a lot of work to be ready for a production site. To add the option for media feedback is mandatory, even the Allfacebook plugin, which is not an official one and is at a rather early stage of development, has it. Alternatively, it should be possible to have some, even minimal, control on the translation rules without tweaking with the code (which seems to do nothing in most cases, and is moreover quite badly documented). * PS Why there is no feedback from the plugin authors in this forum? * [toccia](https://wordpress.org/support/users/toccia/) * (@toccia) * [9 years, 11 months ago](https://wordpress.org/support/topic/adding-space-between-images/#post-7434877) * Same problem for me. Do you know if there is any way to add custom style to IA tags – e.g.
xxxxx
* I guess all the users of this plugin are suffering from this issue. Hopefully the authors will have a look soon. * Best, * [dannywan](https://wordpress.org/support/users/dannywan/) * (@dannywan) * [9 years, 10 months ago](https://wordpress.org/support/topic/adding-space-between-images/#post-7434902) * I am facing the same error from facebook review, white space is needed between image
* Why there are no feedback from the authors? * [riccarbi](https://wordpress.org/support/users/riccarbi/) * (@riccarbi) * [9 years, 10 months ago](https://wordpress.org/support/topic/adding-space-between-images/#post-7434906) * The only working solution I have found so far is to manually edit the post by replacing the
tag with
. Nothing else worked for me. This is an annoying procedure and if you update your original post all the fixes are lost. * Hope they’ll fix this issue soon… * PS. With the last update, it looks there are problems with the automatic conversion. I no longer see any of my newest posts in my Instant articles feed …it seems that the automatic submission to the “production articles” section in FB stopped working… * Yet, this is not a big problem, since my instant articles seem to perform a bit worse in terms of audience reach and engagement than my normal link posts in FB, which is honestly quite surprising (to be polite)…. * [nl1947](https://wordpress.org/support/users/nl1947/) * (@nl1947) * [9 years, 2 months ago](https://wordpress.org/support/topic/adding-space-between-images/#post-8900066) * **All too complicated **& most of it doesn’t work I have 1000’s of images on my educational site Solution for me was simple Create a 10px X 10px transparent png and insert between the images (make it any size you want) I upload the png along with the group of images I want to post No fussing around trying to insert script that may not work - This reply was modified 9 years, 2 months ago by [nl1947](https://wordpress.org/support/users/nl1947/). Viewing 12 replies - 1 through 12 (of 12 total) The topic ‘Adding space between images’ is closed to new replies. * ![](https://s.w.org/plugins/geopattern-icon/fb-instant-articles_8fa0a4.svg) * [Instant Articles for WP](https://wordpress.org/plugins/fb-instant-articles/) * [Frequently Asked Questions](https://wordpress.org/plugins/fb-instant-articles/#faq) * [Support Threads](https://wordpress.org/support/plugin/fb-instant-articles/) * [Active Topics](https://wordpress.org/support/plugin/fb-instant-articles/active/) * [Unresolved Topics](https://wordpress.org/support/plugin/fb-instant-articles/unresolved/) * [Reviews](https://wordpress.org/support/plugin/fb-instant-articles/reviews/) ## Tags * [fb](https://wordpress.org/support/topic-tag/fb/) * [figure](https://wordpress.org/support/topic-tag/figure/) * [images](https://wordpress.org/support/topic-tag/images/) * [margin-bottom](https://wordpress.org/support/topic-tag/margin-bottom/) * 12 replies * 5 participants * Last reply from: [nl1947](https://wordpress.org/support/users/nl1947/) * Last activity: [9 years, 2 months ago](https://wordpress.org/support/topic/adding-space-between-images/#post-8900066) * Status: not resolved