How to combine customized Twitter Bootstrap and H5BP? - javascript

I am looking for a best practices to combine between customized Twitter Bootstrap and H5BP (HTML5 Boilerplate) .
I've tried to use this shell script to quickly setup a project at this link and Initializr generator.
Ps: Customization consist in choosing the color and size... using Twitter Bootstrap customize variables
Any help is appreciated :-)

I do
git clone git://github.com/twitter/bootstrap.git.
Make some change in less files in less/*.less
You might want to change some values in variables.less
And Run make bootstrap in git cloned folder.
It will create bootstrap folder in your bootstrap folder.
Use that files in created bootstrap folder.

Related

Switch Angular themes using CSS and Angular material themes

every one
I'm working on an angular application in which I need to change themes based on login info.
I tried using different css pages but that does'nt seem to work as we can use only single css page per component and switching css files looks like impossible for me. I've saved a css file in assets and tried accessing it but its not working.
Is there a way to switch styles.css based on a condition.
Im using angular 4 and typescript if that can help. Or is my approach totally wrong at this and should I be using angular themes given in angular material ?
The angular material themes are using scss while im using css. So please help!!

how to use materializejs components with meteor

I use materialize framework for my front-end meteor app.
I have installed materialize package and jQuery package, and I can use componants that use only css but when it came to js componants I can't find where to put the Initialization.
For example I want to add dropdown I take the HTML code and I put it inside my HTML file
enter image description here
After that I didn't know how and where can i put the js or jquery code
enter image description here
So I want to know where and how I use the js or the jquery lines please.

Adding Particles.js into DIVI theme

Im having troubles with adding JS particles.js "adding Particles.js" into DIVI them which can be found here
(particleJs)Even i add HTML,CSS,JS the result cant be seen, thank you for reply.
I would enqueuer the scripts in functions.php, also before updating this I would create a child theme and add a functions.php file to your child theme and make the changes there to ensure you don't loose the change come updating the theme
Creating a child theme -> https://codex.wordpress.org/Child_Themes
Encuing scripts -> https://developer.wordpress.org/reference/functions/wp_enqueue_script/
I know this is a bit late but for the sake of future generations - there is an easy way using the following WP-Plugin ParticleJs-WP-Plugin that is available form Github only. This plugin allows you to use the Particle.js JSON via copy&paste.
The first argument of the function is your ID-name that you can use in the divi builder CSS-section.
particlesJS('your-particle-css-id',{});
Of course you can as well make a child theme and enque the scripts in functions.php but the plugin does it all for you and is very lightweight.

jquery ui theme creating custom jqueryui.js file

When I download a jquery ui theme via themeroller I get a jquery-ui-1.10.4.custom.js file instead of the standard jquery-ui-1.10.4.js file that comes with a regular jquery ui download.
I am trying to understand what is changing in jqueryui.js file from theme download to download. I was under the impression that nothing should change the .js file and that themes were just .css. Is this not the case?
I did not apply any customizations to the theme I downloaded (starter theme) and then added just the .css to a page with the regular jqueryui linked up and the page didn't work. When I tried with other themes though such as the hot-sneaks I did not have this problem.
I am asking this question because I would like to link to the jqueryui on a cdn and I just want to use the vanilla version. Is this possible?
Thank you for your help.
I don't think there is anything different other than the name. You could try running them though a compare tool to see if there are any differences.
Here is an online Comparer http://www.diffnow.com/

javascript in Joomla custom module

I have a code generated by "highslide" software and what it does is to create an image gallery.
This code consists of .css html and javascript.
If I place the htmal code in the Joomla's "index.php" file and then the rest of the file in the root directory then the image gallery is working and is placed in every page in Joomla.
I do not want this. Is there a way of assigning that image gallery to only pages I choose?
Or is there a way to find out what is the index.php main file for that specific page I need to have the gallery and paste the code in there?
I have tried to insert the code in a custom module via the Joomla's editor but when I click on save then it compiles the code and remove certain parts of it and cannot work.
It removes the link to javascript and to css file.
Is there a way without any other third party extension to have that code into the custom module without then Joomla eliminate the half of the code?
Thank you,
Best Regards,
Andreas Achilleos
I would not add things like this to your index.php file. This is Joomla, not a static html website ;)
You have 3 options:
Option 1 would be to develop your own module and install it on your Joomla site. This option would take the longest amount of time and would require you to get your handy in a bit of coding.
Option 2 would be to firstly download, install and enable a plugin called Sourcerer. Once done, in the Joomla backend, create a new "Custom Module" and manually add your html code. After, below the big textbox, you will see a button below saying "Insert code". O modal will popup allowing you to add your custom code. Simply add your CSS and JS using the <style> and <script> tags.
Option 3 would be to use a pre-built Image Gallery extensions from the Joomla Extensions Directory. There are loads to choose from.
Hope this helps

Categories