maahd
maahd

Reputation: 712

Bootstrap social buttons

I'm using social buttons for twitter bootstrap 2. For some reason, the Facebook "f" logo in the button is not showing up. Here is my front end code:

{% include "meddy1/header.html" %}
{% load staticfiles %}

<link href="../../static/meddy1/css/social-buttons-3.css" rel="stylesheet">
<link href="../../../bootstrap-social-gh-pages/bootstrap-social.css" rel="stylesheet">
<link href="../../../font-awesome-4.2.0/css/font-awesome.css" rel="stylesheet">


    <!-- CSS links -->
    <link href="{% static "meddy1/css/login-signup.css" %}" rel="stylesheet" media="screen">
    <link href="{% static "meddy1/css/login-signup-responsive.css" %}" rel="stylesheet" media="screen">
    <!-- End CSS links -->


 <div class="wrapper">
      <div class="container">

        <!-- Log In -->
        <div class="login">
          <h1> SIGN UP </h1>

  {% if user.is_authenticated and not user.is_superuser %}
      <h3>Hi {{ user.first_name }}. Thanks for loggin in!</h3> 
  {% else %}
      <buttton class="btn btn-facebook"><a href="{% url 'social:begin' 'facebook' %}?next={{ index }}" class="fa fa-facebook"> | Signup with Facebook</a></buttton>
  {% endif %}

  <h4> OR </h4>

  <form action="" method="post" id="user_uploader" enctype="multipart/form-data"> {% csrf_token %}
   {% for field in form.visible_fields %}
                {{ field.errors }}
                {{ field.help_text }}
                {{ field }}
            {% endfor %}

   <p class="alert">By Clicking “Sign Up” below, you are agreeing to the Meddy <a href="/terms">Terms of Service</a> and <a href="/privacy">Privacy Policy</a></p>

    <button class="btn btn-primary" type="submit" name="submit" id="ss-submit">SIGN UP</button>
    <form></form>

    <button class="btn btn-facebook"><i class="fa fa-facebook"></i> | Connect with Facebook</button>




</div>
        <!-- End Log In -->

      </div>
    </div>
    <!-- End Content -->


  </body>
</html>

{% include "meddy1/footer.html" %}

Am I missing a link to any crucial file? Can't figure out why the Facebook logo isn't showing up. My webapp is in Django.

Upvotes: 2

Views: 3262

Answers (2)

maahd
maahd

Reputation: 712

I figured it out. I had to add this line:

<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

Upvotes: 1

Bbovenzi
Bbovenzi

Reputation: 1

It looks like you're missing the i tag inside the button tag:

<i class="fa fa-facebook"></i>

Which would then look like this for you:

<buttton class="btn btn-facebook"><a href="{% url 'social:begin' 'facebook' %}?next={{ index }}" class="fa fa-facebook"><i class="fa fa-facebook"></i> | Signup with Facebook</a></buttton>

Upvotes: 0

Related Questions