How would I go about installing a Twitter Bootstrap theme such as http://bootswatch.com/flatly/ to an existing Django website? I'm quite new to all of this, so I'm a little lost as to where I should begin. I'm well acquainted with Javascript, CSS, and JQuery, but I'm not too familiar with Django.
I've looked into demo projects such as https://github.com/dyve/django-bootstrap-toolkit, but I'm not sure where I should begin for an existing project.
Thanks in advance for all your help!
You can put the css into the static folder and call the css in the html:
<link rel="stylesheet" href="{{STATIC_URL}}bootstraptheme/css/styles.css">
Related
How do you incorporate MathJax into a GitHub Pages Site?
People have asked this question here multiple times but they’re old. So I’m trying to figure out how to incorporate MathJax 3 into a GitHub Pages site.
I have looked into this problem...
After going over this guide
https://docs.github.com/en/github/working-with-github-pages/creating-a-github-pages-site-with-jekyll
how do I then incorporate Mathjax 3 into my site?
Edit
I have this in my _includes/head.html:
<script type="text/javascript" id="MathJax-script" async
src="https://cdn.jsdelivr.net/npm/mathjax#3/es5/tex-svg.js">
</script>
And in my _config.yml I have;
math_engine: mathjax
And in my post I wrote:
usemath: true
Thanks.
so I’m working with Django and I’m trying to figure out how in the edit the CSS using nothing but Django CMS?
Is there a way?
Anything would be helpful.
Django CMS does not have any inline editing features of CSS or any other markup. This is by design and it is not something like Wordpress.
To edit CSS you will need to create your own css files as part of your project.
If you need to add eg an HTML or CSS snippet into a page, there's an offical plugin for that 👌 - https://github.com/django-cms/djangocms-snippet
And as #Aiky30 said, the global CSS code is better to place in static in accordance with django best practices.
I have a problem with ember-cli build option.
While running server by ember s it's showing normal page with content, styles etc.
But now I want to build this app and put it on my website by ftp so i tried ember build which build my project into /disk folder but the index.html file doesn't contain the stuff from application.hbs + no styles from styles/app.css.
I'm new to ember. What am I doing wrong? Docs of ember are saying nothing about this.
All of your app is actually pulled in through external assets.
So, looking at your pre-built index.html, you'll see something like this:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>emberclear</title>
{{content-for "head"}}
<link rel="stylesheet" href="{{rootURL}}assets/vendor.css">
<link rel="stylesheet" href="{{rootURL}}assets/emberclear.css">
{{content-for "head-footer"}}
</head>
<body class='has-navbar-fixed-top'>
{{content-for "body"}}
<script src="{{rootURL}}assets/vendor.js"></script>
<script src="{{rootURL}}assets/emberclear.js"></script>
{{content-for "body-footer"}}
</body>
</html>
my application is https://emberclear.io, named emberclear, so substitute your app name where applicable.
In the head, we see two link tags.
the first link is for all the styles that your addons may include (maybe such as material-ui, or bootstrap, or bulma).
The second link is your actual app styles. for me, emberclear.css includes everything from app.css, and all of its dependencies (I'm actually using scss, so I can include stuff via scss' #import).
Down in the body we see two script tags.
vendor.js will contain ember itself, and any addon dependencies that need to be included at run time, such as ember-paper's library of components.
emberclear.js includes your app -- routes, templates, etc.
This technique is common for all single page apps, and isn't exclusive to ember. anything built with react, or vue, has a similar pattern.
If you're wanting to have html and css be a part of your index.html, fastboot (https://www.ember-fastboot.com/) + prember (pre-rendered ember: https://github.com/ef4/prember ) may be of interest to you.
Hope this helps! :)
If something is wrong, feel free to copy your built index.html from dist (and maybe additional files as well).
Some follow up questions for you, depending on the issues you are running in to:
Are you getting any errors?
What happens when you try to open the dist/index.html file locally?
You're uploading the contents of dist to an ftp folder. This in-of-itself is fine, but has the web-sever been told to use that ftp folder for a website?
How are you attempting to access the ftp folder via browser?
Maybe there is a domain/path we could look at to see additional details?
I saw some examples,bu it don't solve my problem!
Any help will be Appreciated....
As you already have the files locally in the static folder, you can just use them in the html templates, for example:
{% load static %}
<link href="{% static 'css/bootstrap.min.css' %}" rel="stylesheet">
CDNs, or content delivery networks, are code files hosted on the web that you can include in your project. Using a CDN is the fastest way to get set up with Bootstrap.
Find a CDN for Bootstrap. MaxCDN hosts the latest version:
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
Simply include the code above in your HTML head element and you will be good to go!
Another option is to download your own copy of Bootstrap and integrate it into your project structure.
I have solved this problem ,the version of the Django is 1.11. I check the Django website,it told me I must build files like this and set setting.py like this.But thanks for all of you!
enter image description here
I had a favicon working for a while on my index template, but not any any other template, and now even my index template won't show it.
I'm just in development, so I'm using ember server.
index.html
<link rel="icon" href="favicon.ico">
Just throwing around my favicon to see if it shows up anywhere, I now have it in the following locations:
app/
public/
public/assets
I think this should be very straightforward, especially since the index page doesn't change, just get's new stuff loaded into its outlets, so I can't figure out why it can't find my favicon file.
When running ember server, where actually is the / root pointing to?
If you keep the favicon file in public/assets/ you can reference it like this:
<link rel="icon" href="/assets/favicon.ico">
The Ember CLI docs have a good section on this
You could also check out ember-cli-favicon.
It's an addon that takes your source public/favicon.png and automatically outputs all the different favicon formats and sizes for different devices, as well as injects the appropriate HTML into your index.html file as part of the build process.