bootstrap glyphicons are not working in wordpress theme - wordpress

I made a website using a yeoman-generator webapp,bootstrap and sass. the site is built and everything was working fine but when i tried to make the site into a WordPress theme the glyphicons stopped showing.So i checked and the src path to the glyphicons were wrong. the path had everything correct but it left out the theme's name (apple).
ex:-
correct = C:\xampp\htdocs\wordpress\wp-content\themes\apple\fonts\glyphicons-halflings-regular.ttf
wrong = C:\xampp\htdocs\wordpress\wp-content\themes\fonts\glyphicons-halflings-regular.ttf

Don't change Bootstrap file location, it's not a good practice. Keep all the Bootstrap's files inside the bootstrap folder and just include the CSS and JS file from there in your page.
You can checkout this page for more info - http://www.tutorialrepublic.com/twitter-bootstrap-tutorial/bootstrap-get-started.php

Glyphicons are not part of Bootstrap 4 anymore.
Because UnderStrap based on Bootstrap 4 they were removed too.
use this cdn :
<link rel="stylesheet prefetch" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

Related

Does Dojo have a default CSS file with no theme applied?

I am trying to build a new design on an old system that is using DOJO, eventually we are going to move to AJAX to handle the data calls. Is there a default or minified CSS file so I don't have to use their themes? (i.e. Claro, which is the theme that was and still is applied)
It says you can make custom themes, but there has to be a bare bones version out there somewhere.
Thanks for your time.
The bare minium CSS is available in dijit.css
(you can see the file on the CDN: https://ajax.googleapis.com/ajax/libs/dojo/1.10.0/dijit/themes/dijit.css)
As dojo team says about this file :
Essential styles that themes can inherit.
In other words, works but doesn't look great.
So be aware it will be ugly!
But you can build your own theme starting from that.
dojo comes with out of the box the following themes:
Claro
Tundra
Soria
Nihilo
There is no really a default CSS a part of the CSS which is included in on of the listed theme. But as ben point out in his answer, there is a dijit.css which is a very essential base of CSS which other themes can in-heritage from.
You can apply them adding the following in your HTML file:
<link rel="stylesheet" href="dojo/dijit/themes/claro/claro.css" />
<body class="claro">
Or you can use a CDN, example for claro (just change the name for css file in order to get a different theme):
https://ajax.googleapis.com/ajax/libs/dojo/1.10.0/dijit/themes/claro/claro.css
The CDN version is an unique file and easy to include in your app but it is not minified.
If you need to have a minified version, you could use the dojo build to compact all your project files and included CSS for your theme minified.
More info here:
https://dojotoolkit.org/reference-guide/1.10/dijit/themes.html#id10

Bootstrap CSS conflict in joomla module

I am creating a joomla module which uses bootstrap to style the various input fields. In my module's default.php file, I have incorporated bootstrap via the normal css link <link type="text/css" src="http://mylink.com/modules/mod_mymodule/css/bootstrap.min.css">. This works well with a non-bootstrap template but with a template which does use bootstrap, certain elements of the template do not display properly as a result of the bootstrap css file I have linked in my module. If I unlink the bootstrap file in my module, the input elements in my module are not responsive and the display of the module is just horrible.
My question is, how will I be able to incorporate bootstrap to my module without distorting the display of a bootstrap enabled template and also have my module displaying perfectly in a non-bootstrap template?
I realized the Joomla site I am using uses Bootstrap 2.3.2. Simply had to style my form to match the existing bootstrap file

How to Implement Sass into Underscores Theme with Bootstrap for Wordpress?

I was able to create a Wordpress theme that I am working on, using my local machine. The issue I am having is incorporating Sass into the Underscores Starter theme, with Twitter Bootstrap's Sass and Wordpress.
I was creating the fixed-top bootstrap navigational bar. I managed to add the proper code to include WP_Walker_Nav in my functions.php file, but this is what my navigation looked like My Bootstrap Nav.
The content is too close to the fixed-top navigation and I wasn't able to control the body tag styles to provide padding of at least 60px from the top.
I was wondering if someone can guide me in the direction on how to incorporate Twitter Bootstrap's Sass and Font-Awesome's Sass into Underscore's Wordpress theme.
I'm struggling with the proper workflow. For my Wordpress default style.css, all I would do is put
#import url("css/style.css");
underneath Wordpress Stylesheet default comments.
I have a folder labeled sass (for all my scss files) and a folder css (for all my compiled css). In my style.scss, I import bootstrap and font-awesome's sass files, and I create a separate scss file (main.scss) to use for my custom styling, but nothing works when I create a variable in my main.scss file.
I would set my style.scss file like this:
#import 'main';
#import 'bootstrap-sass';
#import 'font-awesome';
For example:
$padding10: 10px;
body {
padding-top: ($padding10 * 6)
}
nothing happens when I set up my body tag. Please tell me what I am doing wrong, any help is appreciated. Thank you!
For those wondering about how to do this: the _S Underscores theme added direct support for generating a starter theme with a sass-based architecture last year, which I only recently found out about. If you click the “Advanced Options” link on the Underscores main page, you can then select the _sassify! option and you’re on your way. From there, it should be clear to you how to wire in Bootstrap. The generated sass/styles.scss file in your new theme is a very well organized and documented list of imports, to which you can add Bootstrap however you wish (via Bower, direct download, whatever).
As a side note, you can automate this and make it even easier via wp-cli, which very recently added support for the sassify option to their wp scaffold _s subcommand, which looks something like:
wp-cli scaffold _s my-sassy-theme --theme_name="My Sassy Theme" --sassify
(Note that as of this writing, there hasn’t been a release of wp-cli with that feature; you can use it immediately, however, by installing the wp-cli nightly.)

adding CSS to Grails

I am still relatively new to Grails. I am trying to use Bootstrap for the CSS. I have added the bootstrap files to the CSS folder. I have added the plugin. I have added links to the head of the main.gsp as links and the pathing looks correct. But still no joy. I do not want to have a <style></style> in my gsp's. Any advice on how to get the gsp to call the proper CSS?

Any ideas how i can use Fortawesome without override the theme css

Any ideas how i can use Fortawesome without override the theme css in wordpress?
I tried using boostrap cdn adn upload the folder on server.
You can add the CDN link of fontawesome to your theme's 'functions.php' file. A brief information about this has been given here. You can also use this plugin to integrate fontawesome icons easily into your blog/site.

Resources