Is facebook 'like' only button (without counter) no longer possible?
How do I shut off the counter +'comment-bubble'? works g+,pinit etc - on these I easily using their HTML5 code generators create asyncronous buttons without counters - don't show any counter - see www.LazyBee.biz for clarification.
Any ideas?
How do I fix this code so no counter is shown (see under comments below):
Wwhy can't facebook do like all other major social players and let user opt out of the counter-swamp?
I have seen some people put the like button in an <div> and then make the width exactly the width of the button (without the counter) and put overflow: hidden in the CSS for the div. Basically the div acts as a matte of sorts.
Sure, just create a button yourself and use the API to initiate a like. See also How to trigger Facebook like button from custom button?
It is possible to generate the Facebook like button without the counter bubble.
In the code that Facebook's generator gives you there will be a parameter called data-layout, depending on the options you selected it will be one of four things: standard, box_count, button_count or button.
If you use button it will generate a single button with no counter.
EDIT:
I just noticed your comment with the code supplied by Facebook. If you change it to the following it will remove the counter:
<div class="fb-like" data-href="lazybee.biz " data-width="30" data-layout="button" data-show-faces="false" data-send="true"></div>
Related
Here's my use case:
I'd like to display the information about something first using django_tables2, with a button on the top right corner called "Edit", once a user hits "Edit", at the bottom of the table, display a button called "Add New Record", and once the user clicks that button, a bunch of input fields pop up to let users enter values for each field, also the user could continue to click "Add new Record" to keep adding new.
How can I achieve this in Django?
I've read a lot of examples on stackoverflow but didn't find anything tailored to this particular case.
Thanks a lot.
Let's dive right into listing out what you want to do and the requirements you'll need to do so.
You basically want to toggle hiding and showing some functionality for this web page. This is easily accomplished by including the "Edit" button, "Add New Record" button, and popup (most likely in its own <div> somewhere in the page). So the "Edit" button will have the display set to something, be it inline, block, etc., while the "Add New Record" and popup would have a display of "none" or however it is you wish to hide it.
You've got the stuff set up and ready to go but now you need to show it when you click the "Edit" button. This is generally accomplished through Javascript. Just find the "Add New Record" button and switch the visibility.
When you click on the "Add" button you want to display a popup. This can be done in a variety of ways with different libraries. One of my personal favorites is using jquery's blockUI. Why? It doesn't allow the user to click anywhere except in the popup so it's a quick way to handle users trying to reach outside the scope of the popup.
So you've got all the new rows added and you are done editing. Maybe you have a "Save" button or something like that where you can click. When you do, you'll want to push all those new rows you just added to the database. Django handles this well and you could do something like include the new rows in part of the POST request or however you care to implement this solution.
So there's a bit of work ahead of you to get this page up and running with the exact functionality you need but hopefully this starts steering you in the right direction of where you need to go.
I have the following structure of fields in a form within an Ember app:
<div class="box">
<label>Name</label>
{{text-input value=model.name}}
</div>
<div class="box">
<label>Gender</label>
{{chosen-select value=model.gender content=selectOptions.genders}}
</div>
The text-input tag refers to a component that inherits from Ember.TextField. The chosen-select tag refers to another component that inherits from Ember.Select. One of the behaviors provided by chosen-select is that it converts the <select> element into a chosen select for better user interaction.
After doing that, I wanted to give the focus to any input field (textfield or select) whenever the user clicked anywhere in the field's surrounding box, not just on the field or its label. I was able to do it successfully with the text input fields, using the code below (pure jquery, no ember was needed here):
$(document).on 'click', '.box', ->
$(this).find('input').focus()
By attaching the click event handler to the document, I'm able to catch clicks on .box elements that do not exist at the time this event handler is declared. The result is that whenever a .box element is clicked, the text input field inside it (if any), gets the focus.
Achieving it for selects too
I wanted to achieve the equivalent behavior for .box elements containing a chosen select, which is to have the dropdown from the select being open programmatically when the surrounding .box is clicked.
According to chosen's options documentation, if we want to programmatically instruct a chosen control to open its dropdown, we must sent it the chosen:open event, so this is what tried, adding it to the code above:
$(document).on 'click', '.box', ->
$(this).find('input').focus()
$(this).find('select').trigger('chosen:open')
And it does not work. It does not give any errors either. I then noticed that if I issued that last line from the browser's js console it works (substituting this with a reference to a .box element, of course). When issued from the console, the corresponding select inside that box opens its dropdown. But when issued from the click event handler above it does not work.
So I figured I needed to issue this command not directly in that context, but using some of Ember's Ember.run functions, like Ember.run.next and some others. But I've had no luck, and I've tried all sorts of things, even triggering the event after a small delay.
I was hoping that someone here with some Ember.js expertise could shed some light on this problem. I assume the problem is when ember, because if I get an equivalent html with no ember (from the front-end designer that gave me the html I'm working with) the thing works flawlessly from the click event too.
I've been translating a theme by simply customizing the HTML, but I've run into a problem:
The "Add to cart" button on a product page. I can translate the label on the button, but when you click the button the text changes from "Add to cart" to "Adding..." and then to "Added!".
Neither "Adding..." nor "Added!" are anywhere to be found the HTML of the theme, so I'm wondering where I should look if I want to translate those?
The "Adding", "Added" response comes from the theme's javascript - unfortunately that's hard-coded in and there's not a way to change it. You may want to try modifying another theme that doesn't use ajax to add products to your cart, like Sexy, Luna, or Nova - then you should be able to have more control over translating your store completely.
I have added on my web-sire some social buttons. Tweet share button works just fine but I have some issues with facebook and google+ button.
In fact I added this away the buttons : (the buttons are supposed to link to a web page through a parameter $URL
<div class="g-plusone" data-size="medium" href="{$URL}"></div>
and for facebook
<iframe src="http://www.facebook.com/plugins/like.php?href={$URL}&layout=button_count&show_faces=false&width=90&action=like&font=verdana&colorscheme=light" allowtransparency="true" style="border: medium none; overflow: hidden; width: 90px; height: 21px;" frameborder="0" scrolling="no"></iframe>
In fact I used iframe because my buttons are wrapped by divs that displays them in grey and color them the expected way on hovering.
The problem I have is that when clicking on the g+ no box appears, and when I click again, the g+ button displays a red triangle instead and I have a "+1 button errors" message : but I am in none of the case that would explain this kind of message.
When clicking on the facebook-like, I have nothing displayed on my facebook's wall...
Does anybody has an idea how to fix it ?
For the +1 button, I have a few things you can try. Is the actual button itself rendering also or are you getting unexpected behavior when you click it?
If the button isn't rendering, you might be missing the JavaScript library for Google+. The following code should be added to your post before the actual button gets rendered:
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
If you are getting unexpected behavior when the button is clicked, you probably are having an issue with the URL parameter. You might be able to get by without passing a URL because the +1 button defaults to the current page. The following example shows the simplest case of rendering the +1 button for the current page:
<g:plusone></g:plusone>
If that correctly renders, you are putting something bad into the URL parameter or have something wrong with the strings in your parameters. For example, check that the strings you're using don't have backticks in the starting or closing quotes as opposed to single quotes.
The +1 documentation will have any additional details that you will need for configuring and customizing the button and its parameters. You can find it here:
https://developers.google.com/+/plugins/+1button/
On one of my pages I'm showing about 60 items I would like to be "likeable" via facebook. The problem is that I can not use several pages to show the items since this would reduce the usability of the page. But when loading / showing 60 like buttons is just too much for my browser. The page is not usable anymore because even scrolling takes several seconds because of the impact of showing 60 likte buttons.
Does anybody know of an alternative way of using the like button? Would it be possible to build a custom like button which loads the like count from my local database and somehow triggers the facebook like mechanism when the user clicks on my own like button?
This could be done by building a custom like button which on click loads the real like button, hides it and automatically triggers the click on the real like button? Would this even be allowed or is forbidden by the facebook guidelines? If that is the case, is there any other way?
Best regards,
Daniel
Use a placeholder image and load them lazily via javascript when the user hovers on it. That's what Techcrunch does.
There are a few things you can do here that may speed up load times:
Make sure you're only loading the JS SDK once - the latest code from the Like button configurator takes care of this for you.
Load the JS SDK asynchronously, as described on the JS SDK overview page
Use the XFBML version of the Like button
You should use xFBML version of Like button and load the SDK asynchronously.
http://developers.facebook.com/docs/reference/javascript/
You cannot trigger the click of a like button in javascript.
You can however, hide the like button until the user hovers over the like button and create it then.
Something like this might be helpful:
http://www.reddit.com/r/programming/comments/k6kzy/german_publisher_heise_creates_a_privacy/