This forum has moved to a new location and is in read-only mode. Please visit talk.octobercms.com to access the new location.
Hello, I use a theme I bough on Themeforest and there is a .js file with which I can change a few styles easier. I'm not allowed to copy the whole code here but it looks like this: (function($) {
"use strict";
/* ================ Choose your template theme color, skin and layout. ================ */
var $theme = 'light', // available values: 'light','dark'.
$skin = 'default', // available values: 'default','1','2','3','4','5','6','7','8','9','10','11','12'.
$layout = 'wide', // available values: 'wide','boxed'.
$shape = 'top-angle', // available values: 'new-angle','round','border5px','square','right-angle','left-angle','top-angle','bottom-angle'.
$bodyclass = 'bg1', // for boxed layout only, available values: patterns : 'bg1','bg2','bg3','bg4','bg5','bg6','bg7','bg8','bg9','bg10' & background images: 'bg11','bg12','bg13'.
$rtl = '0', // 0 is false and 1 is true.
$page_transition = '1'; // 0 to disable page transitions.
var theme_css = $('#theme_css').attr('href'),
theme_name = theme_css.substring(theme_css.lastIndexOf("/") + 1, theme_css.length),
th_nam = theme_name.replace('.css',''),
skin_css = $('#skin_css').attr('href'),
skin_name = skin_css.substring(skin_css.lastIndexOf("/") + 1, skin_css.length),
sk_nam = skin_name.replace('.css',''),
theme_url = theme_css.replace(theme_name,''),
skin_url = skin_css.replace(skin_name,'');
if($theme == th_nam || th_nam == 'light'){
$('#theme_css').attr('href',theme_url+$theme+'.css');
}else{
$('#theme_css').attr('href',theme_url+th_nam+'.css');
}
if($skin == sk_nam || sk_nam == 'default'){
$('#skin_css').attr('href',skin_url+$skin+'.css');
}else{
$('#skin_css').attr('href',skin_url+sk_nam+'.css');
}
if($layout != 'wide'){
$('.pageWrapper').addClass('boxed');
$('body').addClass($bodyclass)
}
// add shapes styles.
$('html,.shape').addClass($shape);
if($rtl == '1'){
$('head').append('<link rel="stylesheet" href="assets/css/rtl.css">');
var $rt = true;
}else{
var $rt = false;
}
So for example if I write this in the HTML code: Button text In this case "shape" equals "top-angle". And if I write something else, like "new-angle" the shape of the button changed.
My problem is that I can't make it work with October CMS. In this template I have the html files and all the other files in a folder called "assets". So in the assets folder I have a css folder, a js folder and an img folder. It is the same structure as October CMS has by default. So I created a theme in October and uploaded these folders (css, img, js) to the assets folder. Now the theme looks amazing except this one thing. How could I make this scripts.js file work with October?
into your layout
<script src="{{ [
'assets/js/your.js',
]|theme }}"></script>
{% framework extra %}
{% scripts %}
</body>
or into your page if you already define {% scripts %} somewhere (take a look in documentation)
url="/"
==
function onStart()
{
$this->addJs('assets/js/your.js');
}
==
page's html
1-2 of 2