The default Facebook "Like Box" is too big for my site.
I would like to use a very simple like button, without the facebook page picture, name, fan names, etc. When my website's visitors click on it, they should become fans of my Facebook page.
I can't find out how to remove the page name and picture (not sure if it's even possible)... Any idea?
--
update:
here is a very similar question: Facebook Like button for fan page - cannot create simple button with no answer so far. Any workaround I could use?
Is this more like it?
https://developers.facebook.com/docs/reference/plugins/like/
So your code would look something like this:
iFrame:
<iframe src="http://www.facebook.com/plugins/like.php?app_id=212715052108961&href=PAGEURL;send=false&layout=button_count&width=50&show_faces=false&action=like&colorscheme=light&font&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:50px; height:21px;" allowTransparency="true"></iframe>
XFBML:
<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=212715052108961&xfbml=1"></script><fb:like href="PAGEURL" send="false" layout="button_count" width="50" show_faces="false" font=""></fb:like>
Why not just use a like button?
Related
I want to link images on my index page, to their permalink page, but the tags don't seem to be working. It's not that the images are not linking to the correct place, they're simply not being rendered as links at all.
This is the code:
{block:Photo}
<article id="{PostID}" class="post photo">
**<img src="{PhotoURL-HighRes}" href="{Permalink}" alt="{PhotoAlt}"/>**
{block:IndexPage}
<div style="{block:ifShowPhotoCaption} display: none; {/block:ifShowPhotoCaption}" class="control">
{NoteCountWithLabel}
This should link the image on the index page to its permalink page, but it doesn't create a link at all, in the same way 'note count' label does, in the second block of code.
I've tried:
<img src="{PhotoURL-HighRes}"><a href="{Permalink}" alt="{PhotoAlt}"/>
Instead of the code I posted, but it makes no difference. I've also tried moving the {block:IndexPage} to before the {block:Photo} tag, but this doesn't work, and also has the effect of messing up the permalink page when I view it through the 'notes count' link.
My tumblr: http://ginnypig.tumblr.com/
Thanks in advance.
Fixed it.
The code needed to be:
<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/>
As opposed to what I was using:
<img src="{PhotoURL-HighRes}" href="{Permalink}" alt="{PhotoAlt}"/>
I would like to add a button to my website to give the opportunity to my visitors to share content to twitter and I use the following code :
<a href=
"https://twitter.com/intent/tweet?button_hashtag=TwitterStories&text=Check%20out%20this%20app%20"
class="twitter-hashtag-button" data-url="http://test.com">Tweet #TwitterStories</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
The problem is that the url's address is visible. I would like to add a link and display only a phrase (e.g "check this link") which will link to my website.
Is that possible?
Thanks in advance.
I want to know how I can embed an entire reveal.js presentation within the limits of a tag so that my presentation looks like presentations on slideshare.net
Thanks in advance.
You can't do that with a div. What you describe sounds exactly like what iframes are useful for.
<iframe width="400" height="400" marginheight="0" marginwidth="0" src="/your/reveal/slideshow.html">
Fallback text here for unsupporting browsers, of which there are scant few.
</iframe>
I've not tried doing that myself, but that's the right tool to use. Try noodling with that a bit and you should get it to do what you want.
Additional resources:
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe
I was able to embed a deck.js slide deck within a post on my stand-alone Wordpress site using an iframe as Crell suggested. The html content for the iframe was served from a GitHub repository.
Here's the code (input using the Text [not Visual] editor in Wordpress):
**
<iframe src="https://russmcduff.github.io/festschrift/ignite/deck.js-latest/scott.html" title="deck.js in WP post" width="600" height="300">
<p>Your browser does not support iframes.</p>
</iframe>
**
Here's the resulting post:
Example of deck.js slides autoplaying within a Wordpress post
Perhaps the same approach will work for a reveal.js slide deck?
It is possible via embedded property:
Reveal.initialize({ embedded: true })
I am a new coder/web designer and i am trying to add a the youtube logo that when clicked confirm subscription to the users channel
i have a php file with the following coding within...
<div id="youtube">
<img src="/images/YouTube.png />
</div>
this links to confirm subscription and the image directory is correct
however the problem is that whenever i add this into the coding it stuffs everything up!
if you go to any page and right click and go 'inspect element' you will see that the like box for facebook has a box around it which has the room for the youtube picture link
but it doesnt work, as said, when i add it in everything just clumps up together and/or the menu clumps up and goes all weird
You had two problems by the looks of things. The first issue was your include filename was wrong and the second was that you missed the closing inverted comma "
This was on the img src= tag
Try to change your id to something else - like <div id="youtube-confirm">
The youtube id might be reserved in FB script and it messes up your and their stuff
Whatever I set data-url or data-text to, twitter just fetches the URL of the page the sharing button exists in and shows as the tweet-text.
example :
<a target="_blank" href="https://twitter.com/share"
data-count="none" class="twitter-share-button" data-url="http://www.gogole.com"
data-text="BLABLABLA" style="opacity:0">TWEET</a>
or
<a target="_blank" href="https://twitter.com/share"
data-count="none" class="twitter-share-button" data-url="<?php echo
urlencode('http://www.gogole.com')?>" data-text="BLABLABLA" style="opacity:0">TWEET</a>
in both cases, clicking on the link opens a new window with the twitter sharing box that includes the URL of my website and ignores the attributes I set.
Something should have gone dangly wrong. help appreciated !
please tell me if you need more info to be posted.
Thanks,
/t
You can use the query parameter "url" with the twitter share link "https://twitter.com/share"
When looking for the URL twitter button follow this priority:
Look for url in the share link query string
If not found, look for the data-url attribute of the Tweet Button anchor tag
If not found, look for the rel="canonical" link tag in the head of the document
If not found use the URL of the webpage
I have faced same issue - when using link as described in manual's example it didnt work.
this NOT works:
<a class="twitterBtn smGlobalBtn" target=_blank href="https://twitter.com/share" data-text="my_title" data-url="my_url" data-hashtags="my_hash" data-via="my_name" data-related="my_name">Tweet</a>
but this WORKS:
<a class="twitterBtn smGlobalBtn" target=_blank href="https://twitter.com/share?text=my_text&url=my_url&hashtags=my_hash&via=my_name&related=my_name">Tweet</a>
Don't know why twitter ignores data- attributes, but when params are inside the link as GET params - everything works fine.
Hope this will be helpful for someone in future)
I fixed this by moving script widgets.js before button markup and turning off async mode, like this:
<script src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
<a href="https://twitter.com/share?ref_src=twsrc%5Etfw" class="twitter-share-button" data-text="H..." />
twitter-share-button class also important.