This forum has moved to a new location and is in read-only mode. Please visit talk.octobercms.com to access the new location.

Gery
Gery

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?

Pat Och
Pat Och

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

You cannot edit posts or make replies: the forum has moved to talk.octobercms.com.