All Collections
Advanced Settings
Advanced Features
Customizations: change the design/functions with Style.css & Javascript
Customizations: change the design/functions with Style.css & Javascript

This article explains how you can fully adjust the design and interaction via customizations. For Web Developers only!

Updated over a week ago

Basically, all elements and CSS of Krowden can be changed (manipulated) by uploading your own JS & CSS:

  • JS: here you can put al jquery changes > good for creating/updating/hiding elements.

  • CSS: here you can put all css changes > good for changing color, size, etc.

For ease of use, we share an ongoing collection of:

The pages that are used mostly are:
> [eventname].iseated.com/ (main overview)
> [eventname].iseated.com/my-sessions (overview of schedule)
> [eventname].iseated.com/moderate-sessions (for hosts to accept/decline meetings)
> [eventname].iseated.com/event-attendees (list of attendees)

Examples of events that use customizations:
- http://wbecs-full-summit-2020.iseated.com/ (extreme)
- https://bmim.iseated.com/ (simple)

How to work on customizations?
You can inspect the elements / css on the pages and write down in your css file changes such as changing the button color via CSS in the Style.css:

"a.btn-color1, button.btn-color1 {background-color: red}"


You can for example add a button to a certain page as we did for your events on /moderate-sessions via JS in the Scripts.js and test this first in your console:

$(function(){
 if(location.pathname.indexOf('/moderate-sessions')>-1){
$('<a href="/attendees" class="btn btn-md btn-color1 m-t-sm"><i class="fa fa-user" aria-hidden="true"></i>&nbsp;&nbsp;Delegates List</a>').css('margin-left','10px').insertAfter('[data-print-init]');
   $('div.pull-right').prepend('<a href="/attendees" class="btn btn-md btn-color3 m-b-sm m-t-sm makefull"><i class="fa fa-user" aria-hidden="true"></i>&nbsp;&nbsp;Delegates List</a>');
 }
 });

Did this answer your question?