Templating Example
If you’ve overridden your comments templates, here’s how to add in the new social commenting functionality.
The best way to understand how to add the new functionality is to open up the templates/ellington_defaults/
- Open your modifield /comments/form.html file.
- Look for the {% load %} tag at the top of the page. In this tag add facebook_tags and twitter_tags
- Below the comment form, add this:
<h3>Share your comment</h3>
{% if tw or fb %}
<p>Share your comments across social networks.</p>
<ul class="share_form">
{% if tw %}
<li class="twitter">
<div class="toggle">{{ form.twitter }}</div>
<div class="info">
<label for="id_twitter">Tweet on Twitter</label>
<div class="preview"><a href="#" id="preview_twitter">preview</a></div>
</div>
</li>
{% endif %}
{% if fb %}
<li class="facebook">
<div class="toggle">{{ form.facebook }}</div>
<div class="info">
<label for="id_facebook">Post to Facebook</label>
<div class="preview"><a href="#" id="preview_facebook">preview</a></div>
</div>
</li>
{% endif %}
</ul>
<p><a href="/accounts/profile/edit/">→ Add/manage social networks</a></p>
{% else %}
<p><a href="/accounts/profile/edit/">Connect a social network</a> to share comments with your friends.</p>
{% endif %}
Click to copy
You’ll also need to modify the registration/profile_form.html
- Somewhere after the
</form>tag, add this:
{% load twitter_tags facebook_tags %}
{% twitter_info as tw %}
<div id="connections">
<h3>Your linked social profiles</h3>
<p>Link your social profiles to do things like cross-post comments.</p>
<div id="twitter">
<h4>Twitter</h4>
{% if tw %}
<p>Account <span>@{{ tw.screenname }}</span> is connected.</p>
<form action='{{ tw.get_disconnect_url }}' method='post'>
{% csrf_token %}
<p><button type='submit'>Disconnect</button></p>
</form>
{% else %}
{% twitter_button %}
{% endif %}
</div>
{% facebook_info as fb %}
<div id="facebook">
<h4>Facebook</h4>
{% if fb %}
<p>Your Facebook account is connected.</p>
<form action='{{ fb.get_disconnect_url }}' method='post'>
{% csrf_token %}
<button type='submit'>Disconnect</button>
</form>
{% else %}
{% facebook_button %}
{% facebook_js "offline_access,publish_stream" %}
{% endif %}
</div>
</div>
Click to copy
0 Comments
Add your comment