CSS changes

Hi, I made some changes here /web/wp-content/themes/tbr-jenkins/assets/less/style.less such as

.tm-header { border-bottom:3px solid #EDEDED; padding-bottom: 10px; padding-top: 10px; }

but after saving nothing change. Am I in the right place?


the .less file needs to be parsed to CSS, and that happens on your site when you save the code editor. If you just want to add some CSS, you're better off opening functions.php and commenting out the LESS part and uncommenting the CSS part on top of the file so you can just use the style.css file to add your custom CSS instead of the style.less file.

That being said, your normal CSS should be parsed by the less file as well, but you'll need to edit the code through the online code editor in Themes > Editor > style.less


sorry for being so brief. What you can do best is:

  1. Download the child theme for Beans
  2. Upload it to your installation through Themes > New Theme > Upload
  3. Deactivate the Beans theme
  4. Activate the Beans child theme
  5. Go to Themes > Editor and click away the warning confirming you understand the risks
  6. Go to functions.php and delete line 6 - 16, they are as follows:
 * Remove this action and callback function if you do not whish to use LESS to style your site or overwrite UIkit variables.
 * If you are using LESS, make sure to enable development mode via the Admin->Appearance->Settings option. LESS will then be processed on the fly.
add_action( 'beans_uikit_enqueue_scripts', 'beans_child_enqueue_uikit_assets' );

function beans_child_enqueue_uikit_assets() {

  beans_compiler_add_fragment( 'uikit', get_stylesheet_directory_uri() . '/style.less', 'less' );

  1. Then save functions.php.
  2. You can now go to Themes > Editor > style.css and add your custom styles there.

Good luck! If you have more questions, just ask.

Thank you Jasper, i was about to ask the same question.

I will probably simplify my beans install and comment out the less and in the css. But i wont give up on less without trying it first. Can you please explain what you mean with "Code Editor" here: ...and that happens on your site when you save the code editor.

Is there a builtin code editor in beans, or do i have to install it first? I read a lot about Uikit but i cant find any hints about an editor in the Wp backend or in the ftp files. My installation is not on a server but on a webhost, is that maybe the reason why i cant use the editor?

forgot to mention that i am using the Banks Child theme. In the functions.php of Banks i cant find the lines that you mentioned in your post.

Thank you Jasper, now i understand. I use ftp and sublime text to edit, thats why i didnt get what you mean instantly.

Do you know how i can disable the .less in the Banks child theme? The function php looks a bit different there. http://demo.themebutler.com/banks/

it's the first time I'm seeing the "Banks" theme, so I don't know sorry. Can you paste the functions.php on http://pastebin.com perhaps and link it here?

seems like line 19 and 20 take care of that. Can a more experienced coder confirm this?

Write a reply

Login or register to write a reply, it's free!