Missing Like Box with Facebook plug-in and AddThis's Facebook's Like « Support Forum | Kriesi.at

Support Forum » Choices

Missing Like Box with Facebook plug-in and AddThis's Facebook's Like

3 posts from 3 voices

Started 7 months ago by teerasej
Latest reply from Nick
This topic is not resolved

Tags:

teerasej
Member

Hi

whenever user click on 'like' button, both for Facebook official plug-in or AddThis's Facebook Like button, the pop up showed but it has been chopped. Similar to this photo:

you can go to this post and test like button here.

I have tried disable other plugins to test this but no luck. Even official Facebook's wordpress plugin chopped. I think this will not good to your nice theme.

I know this could be solved by applied hot fix to CSS. But could you tell me how? :)

Posted 7 months ago #
Dude
Dude
Personally I couldn't find a way to expand the facbook iframe. I tried:
```
.fb_iframe_widget iframe {
    width: 100% !important;
}
```
and various other css rules but I couldn't get it to display properly. I'll tag this thread for the other support staff members though - maybe they have a better idea/solution.
Posted 7 months ago #

Nick
Moderator

Hi,

[EDIT] http://i.imgur.com/1vBjf.png <-- You are giving a width of 90. Give it a width of 475 or 450 and it will work fine. [/EDIT]

There is something very wrong with the page. You are running on Apache?

Please take a look at .htaccess file and add MIME definitions in there before anything else in the file:

# ----------------------------------------------------------------------
# Proper MIME type for all files
# ----------------------------------------------------------------------

# JavaScript
#   Normalize to standard type (it's sniffed in IE anyways)
#   tools.ietf.org/html/rfc4329#section-7.2
AddType application/javascript         js jsonp
AddType application/json               json

# Audio
AddType audio/ogg                      oga ogg
AddType audio/mp4                      m4a f4a f4b

# Video
AddType video/ogg                      ogv
AddType video/mp4                      mp4 m4v f4v f4p
AddType video/webm                     webm
AddType video/x-flv                    flv

# SVG
#   Required for svg webfonts on iPad
#   twitter.com/FontSquirrel/status/14855840545
AddType     image/svg+xml              svg svgz
AddEncoding gzip                       svgz

# Webfonts
AddType application/vnd.ms-fontobject  eot
AddType application/x-font-ttf         ttf ttc
AddType font/opentype                  otf
AddType application/x-font-woff        woff

# Assorted types
AddType image/x-icon                        ico
AddType image/webp                          webp
AddType text/cache-manifest                 appcache manifest
AddType text/x-component                    htc
AddType application/xml                     rss atom xml rdf
AddType application/x-chrome-extension      crx
AddType application/x-opera-extension       oex
AddType application/x-xpinstall             xpi
AddType application/octet-stream            safariextz
AddType application/x-web-app-manifest+json webapp
AddType text/x-vcard                        vcf
AddType application/x-shockwave-flash       swf
AddType text/vtt                            vtt

Please try adding this to Quick CSS

.fb_edge_widget_with_comment span.fb_edge_comment_widget {
top: 15px !important;
left: -250px !important;}

Error Reference: http://stackoverflow.com/questions/7194591/facebook-iframe-app-send-like-button-z-index-issue

I see the plugin span causing the problem. ( http://i.imgur.com/T3chX.png )Addthis is not functioning properly, and if it is, I would get rid of that plugin. Its injecting files all over the place, mostly garbage like *ok!* , right after <head> starts. Its throwing errors without stop too. I took a look at the forum for the Addthis and nobody is even answering all the complaints. I would find something that is being supported instead of this.