Facebook Tools
ExpressionEngine 2, ExpressionEngine 3, ExpressionEngine 4
Back to this add-on's main page
View Other Add-ons From Rein de Vries
Facebook comments fixed width on containers
Support (Resolved)
DanTreasure
|
Posted: 23 January 2014 07:41 AM |
|
|
|
Hi Rein,
Is there a way to control the fixed width that has been assigned to multiple elements?
Currently a fixed width of 500px is automatically assigned to multiple elements (see this visual reference: http://screencast.com/t/FgwdPhzO). The site is built on a responsive framework and I need to make the comments container more flexible however have been unable to see anywhere that I can adjust the settings?
You can see a live example here: http://justresultsproperty.com.au/blog/post/real-estate-agents-mt-gravatt-brisbane
I’m looking forward to hearing back from you soon!
Thanks,
Dan
|
|
|
Reinos
|
Posted: 23 January 2014 01:42 PM |
# 1
|
|
Developer
|
Did you use the width=”” param? The default is 500px, but you can override it.
Rein
|
|
|
DanTreasure
|
Posted: 25 January 2014 01:19 AM |
# 2
|
|
|
Hi Rein,
I couldn’t see anywhere in your documentation where it shows where to implement the width parameter?
I tried to apply it this way:
{exp:fb_tools:comments width=“100%”}
However, the result was not good:
http://screencast.com/t/gOyUl4nx
Please advise on the correct way to adjust the width?
Thanks,
Dan
|
|
|
DanTreasure
|
Posted: 25 January 2014 01:53 AM |
# 3
|
|
|
Hi Rein,
Ok - I’ve just found the docs section for width (http://reinos.nl/add-ons/facebook-tools/docs/comments) however this is for fixed PX size. Not really useful in a responsive environment.
Is there a work-around?
Thanks,
Dan
|
|
|
Reinos
|
Posted: 25 January 2014 05:20 AM |
# 4
|
|
Developer
|
hmm, well facebook himself don`t support responsive design. Perhaps you can try this: http://stackoverflow.com/questions/6500424/is-it-possible-to-set-a-fluid-width-for-facebooks-social-plugins
|
|
|
DanTreasure
|
Posted: 25 January 2014 09:05 PM |
# 5
|
|
|
Hi Rein,
Thanks for forwarding that SO link through.
Based on everyones comments, and few tweaks of my own, I have managed to get the plugin to behave in a responsive manner.
Below is the CSS I implemented to achieve this (feel free to include in your docs if you want?):
.ee_fb_tools_plugin-comments .fb_iframe_widget,
.ee_fb_tools_plugin-comments .fb_iframe_widget[style],
.ee_fb_tools_plugin-comments .fb_iframe_widget iframe[style],
.ee_fb_tools_plugin-comments .fb_iframe_widget span{
width: 100% !important;
}
In the above CSS, I have specifically targeted the “.ee_fb_tools_plugin-comments”. If you remove this part of the syntax it will target all FB widgets on the page.
I hope this helps other people with the same or similar issue.
Thanks for your quick responses and feedback!
Dan
|
|
|
Reinos
|
Posted: 26 January 2014 07:57 AM |
# 6
|
|
Developer
|
Hi Dan,
Thanks for sharing your code.
Best,
Rein
|
|
|