Skip to content

Instantly share code, notes, and snippets.

@narenaryan
Last active August 29, 2015 14:13
Show Gist options
  • Save narenaryan/9ac6f24f33e80eb179cc to your computer and use it in GitHub Desktop.
Save narenaryan/9ac6f24f33e80eb179cc to your computer and use it in GitHub Desktop.
This is a common pattern and a simple example for creating login page very quickly in django.Just place these files as described in the comment and Get login page
.vertical-offset-100{
padding-top:100px;
}
{% load staticfiles %}
{% block content %}
<!-- This is a very simple parallax effect achieved by simple CSS 3 multiple backgrounds, made by http://twitter.com/msurguy -->
{% block stylesheets %}
<link rel="stylesheet" href="{% static 'css/bootstrap.min.css'%}">
<link rel="stylesheet" href="{% static 'css/logcss.css'%}">
{% endblock %}
<!-- This is a very simple parallax effect achieved by simple CSS 3 multiple backgrounds, made by http://twitter.com/msurguy -->
<div class="container">
<div class="row vertical-offset-100">
<div class="col-md-4 col-md-offset-4">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Heading</h3>
</div>
<div class="panel-body">
<form action="{% url "mysite_login" %}" method="post" accept-charset="UTF-8">
{% csrf_token %}
<fieldset>
<div class="form-group">
<input class="form-control" placeholder="username" name="username" type="text">
</div>
<div class="form-group">
<input class="form-control" placeholder="Password" name="password" type="password" value="">
</div>
<input class="btn btn-lg btn-success btn-block" type="submit" value="Login">
</fieldset>
</form>
</div>
</div>
</div>
</div>
</div>
{% endblock %}
...
urlpatterns += patterns('django.contrib.auth.views',
url(r'^login/$', 'login', {'template_name': 'login.html'},
name='mysite_login'),
url(r'^logout/$', 'logout', {'next_page': '/'}, name='mysite_logout'),
)
@narenaryan
Copy link
Author

Here Just copy login.html to templates folder of app.
Next add that section to urls.py
Just place logcss.css in static/css folder and also don't forget to include latest bootstrap.min.css

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment