Adding custom CSS and Javascript

Adding custom CSS and Javascript to views.

This is a pretty easy part in PythonOnWheels. When you create a view it is usually a visualisation for a specific purpose. Like displaying all articles in a blog. Or showing a shopping card in a webshop.

In PythonOnWheels you just make a view for the specific thing you want to show. This view inherits the "default" view of your site. Standard base.bs4 for bootstrap or base.sui for semanticUI.

The outer (inherited) view has a default structure to render your:

inner view CSS includes (loading css files)
inner view inline CSS
inner view
inner view javascript includes (loading js files)
inner view javascript

This is how this basically looks. (Should be hopefully almost self describing)

<!DOCTYPE html> 
<html lang="en"> 
  <head> 
    {% block include_css %} 
       
    {% end %} 
    {% block view_css %} 
       
    {% end %} 
  </head> 
  <body> 
  <div class="container"> 
        {% block content %} 
        {% end %} 
       
  </div><!-- /container --> 
   
      {% block include_js %} 
      {% end %} 
      {% block view_js %} 
         
      {% end %} 
      <script> 
        $(document).ready(function(){   
          if (typeof view_docready === "function") {  
            // this calls the views docready function if there is one defined. 
            view_docready(); 
          } 
           
        }); 
      </script> 
  </body> 
</html>

... Article is currently work in progress (20/07/2019) ... hopefully ready in one or two days...

tags: