# ------------------------------------------------------------------------------ # ~/_data/components/j1_panel.yml # Template specific configuration data to configure panel lanes # # Product/Info: # https://jekyll-one.com # # Copyright (C) 2019 Juergen Adams # # J1 Template is licensed under the MIT License. # See: https://github.com/jekyll-one/j1_template_mde/blob/master/LICENSE # ------------------------------------------------------------------------------ # NOTE: # By J1 template, "Liquid Procedures" are being used intensively. To load # HTML data for a layout, the loader procedure places the data based this # YAML data file into the REGION specified with a LANE. # ------------------------------------------------------------------------------ # ------------------------------------------------------------------------------ # GLOBALS # ------------------------------------------------------------------------------ # # THE GLOBALS sequence (array) contains general parameters used for # ALL resource definitions # # data_path # ------------------------------------------------------------------------------ # All data items displayed by a panel are being read from a # data file automatically generated from that configuration. # AJAX get method is used to supply the panel with respective # the HTML code at the time the panel is loaded (by the # J1 Adapter for J1 Template). # # values: string # default: /assets/data/panel/index.html # global: data_path: /assets/data/panel/index.html # ------------------------------------------------------------------------------ # PANEL # ------------------------------------------------------------------------------ # # A panel (collection) consists in multiple elements (e.g. cards) # placed in a lane. Each panel is defined as (a hash) of key|value # pairs. The structure depends on the panel type. # Panels are loaded dynamically as asychronous AJAX loads from a # web server - for default the same web server the site is served. # The panel name (key) is used as an id to identify the HTML (
) # element the panel is loaded to. # # The first config block 'lane' defines general parameters of a panel, # the following paramaters defining the cards that are places into # the (panel) lane. # Each box (array element) specifies the content of a (panel) box that # is automatically placed into the lane from the left to the right as # defined from the top down to the bottom of the panel|box configuration # # The size of an box element is automatically calculated based on the # number of cards defined with the panel. It is recommended to NOT use # more than 3 cards per lane (4 cards as a maximum). This makes it sure # that each box will have a appropriate size (width) to display your # information. # # NOTE: # A lane (internally) consists in 12 columns (based on Bootstrap's # Grid System). For example, if 3 cards are defined, the size each # box is being calculated to a width of 4 columns to span them equally # in size (width) across the lane. # panel # ------------------------------------------------------------------------------ # Defines panel details of a specific type # # id # ------------------------------------------------------------------------------ # Specifies the ID of a panel. # # type: string # default: no defaults # # type # ------------------------------------------------------------------------------ # Specifies the panel type # # type: string # values: intro|download|quote|quote_parallax|teaser # default: no defaults # # lane_span # ------------------------------------------------------------------------------ # Specifies the span width of a panel inside a lane. # # type: string # values: fixed|fluid # default: fixed # # icon_family # ------------------------------------------------------------------------------ # Specifies the ... # # type: string # default: no defaults # # style # ------------------------------------------------------------------------------ # Specifies the ID of a panel. # # type: string # default: no defaults # # raides # ------------------------------------------------------------------------------ # Specifies the raised level of the cards used for a panel. # # values: number [0 .. 25] # default: 3 # # cards # ------------------------------------------------------------------------------ # Groups ... # # title # values # # icon_family # values # # icon # values # # text # values # # href # values # # ------------------------------------------------------------------------------ # QUOTE Panels, defines ALL quote|parallax panels # # # type # ------------------------------------------------------------------------------ # values: quote|quote_parallax # # # id # ------------------------------------------------------------------------------ # Set an ID on the HTML element for the parallax quote|banner. # The ID is used to dynamically change the parallax quote for # individual values. # # values: string # default: empty # # quote # ------------------------------------------------------------------------------ # The cite text to be displayed with the banner. # # values: string (HTML) # default: empty # # source # ------------------------------------------------------------------------------ # The cite author to be displayed with the banner. # # values: quote_parallax # default: empty # # gridify # ------------------------------------------------------------------------------ # If enabled, a grit pattern is placed over the background # image. This puts some "noise" on the image to focus more # on the cite rather than the (background) image. # # values: boolean (true|false) # default: true # # gridifier # ------------------------------------------------------------------------------ # Pixel image used to gridify the background image of the # banner. # # values: image path|name (string) # default: /assets/images/patterns/gridtile.png # # darken # ------------------------------------------------------------------------------ # Sets the lightning for the banner|background image. As # higher the value for darken as less is the (background) # light. Values are out of the range from 1 (light) to 9 (dark). # Useful to focus on the quote|text rather than the background # image. # # values: number [1 .. 9] # default: 3 # # background # ------------------------------------------------------------------------------ # Sets the background image of the banner. If no image is # specified, the default images is taken. # # values: image path|name (string) # default: /assets/images/quotes/default.png # # ------------------------------------------------------------------------------ # ------------------------------------------------------------------------------ # panels: # ---------------------------------------------------------------------------- # INTRO panel # ---------------------------------------------------------------------------- # ---------------------------------------------------------------------------- # home_intro_panel # - panel: enabled: true id: home_intro_panel type: intro_panel_flat icon_family: MDI style: flat raised: lane_span: fixed cards: - card: enabled: true type: text # title: J1 Template tagline: Full Responsive icon: responsive icon_size: 8x icon_color: md-grey-800 text: > The Web is everywhere. J1 Template supports all Hardware. For best results on PCs, Tablets and SmartPhones.

Follow Your Visitors. buttons: - button: text: Read More class: btn-primary btn-raised btn-flex icon: eye icon_size: lg icon_color: md-grey-50 href: /pages/public/panels/intro_panel#responsive-design - card: enabled: true # title: J1 Template tagline: HTML5 · CSS3 · JS icon: language-html5 icon_size: 8x icon_color: md-grey-800 text: > Current Technology and Design. Excellent Performance. Present all Content Pages for Products, Projects, Services at it's best.

Make your Web Site unique. buttons: - button: text: Read More class: btn-primary btn-raised btn-flex icon: eye icon_size: lg icon_color: md-grey-50 href: /pages/public/panels/intro_panel#current-technology - card: enabled: true # title: J1 Template tagline: Start in No Time icon: clock icon_size: 8x icon_color: md-grey-800 text: > No programming is needed. For J1 Template, a large number of building blocks are available to manage the job.

Configure what needs to be done. buttons: - button: text: Read More class: btn-primary btn-raised btn-flex icon: eye icon_size: lg icon_color: md-grey-50 href: /pages/public/panels/intro_panel#launch-ready # ---------------------------------------------------------------------------- # SERVICE Panel # ---------------------------------------------------------------------------- # ---------------------------------------------------------------------------- # home_service_panel # - panel: enabled: true id: home_service_panel type: service_panel icon_family: MDI style: flat lane_span: fixed cards: - card: enabled: true type: header title: J1 Template Overview tagline: > Creating and managing Web sites using Jekyll is different in compare to CMS Systems like Drupal, Joomla oder Wordpress. No surprise: Jekyll One Template is different as well. Template systems are very common, a huge number of site templates are available for all CMS and Web site generators. The same to Jekyll. J1 Template is not the first template for Jekyll available - it is probably the youngest!

Classic templates are focussing the layout and design of a web. They offer pre-build, standardized building blocks and tools designing web sites. The are embedded into the creators system and often hard to customize. J1 for Jekyll goes different. J1 Template combines layout, design and functionality for a web. The template offers building blocks to create common page components, implements a sytem independend markup language (Asciidoc and Markdown) to create the content and adds a large number of usefull functions based on common Javascript libraries for the web from a single source. That way, J1 web sites behaves as one unit in design and functionality. No breaks between the different components.

How get this managed? Find below the answers to how J1 template is organized, the building blocks and functional components as an overview. Read in in a quite compact form what J1 Template constitutes: the Core, the Components and the Module. - card: enabled: true type: service icon: bullseye icon_size: 8x icon_color: md-grey-800 href: /pages/public/panels/service_panel_core title: J1 Template tagline: The Core text: > The core integrates the site generator Jekyll into J1, contains all base functions for page layout, design and configuration. Provides procedures to generate web pages automatically based on a given layout based on design settings. services: - service: title: Layout System href: /pages/public/panels/service_panel_core#layout-system - service: title: Template Engine href: /pages/public/panels/service_panel_core#template-engine - service: title: Bootstrap Integration href: /pages/public/panels/service_panel_core#bootstrap-integration - card: enabled: true type: service icon: locker-multiple icon_size: 8x icon_color: md-grey-800 href: /pages/public/panels/service_panel_components title: J1 Template tagline: The Components text: > Building blocks ready-to-use to create common page components, connections to systems and workflows of social networks like Twitter or Facebook or Online Services like Disqus for a blog-related Web and Comments. services: - service: title: Panel href: /pages/public/panels/service_panel_components#panel - service: title: Builder href: /pages/public/panels/service_panel_components#builder - service: title: Connectors href: /pages/public/panels/service_panel_components#connectors - card: enabled: true type: service icon: language-javascript icon_size: 8x icon_color: md-grey-800 href: /pages/public/panels/service_panel_modules title: J1 Template tagline: The Modules text: > Javascript libraries and ready-to-use applications gets the site dynamic. JS modules add complex functionality to Web pages to integrate for example image and video content or provides sliders to present animated text or image data. services: - service: title: Lightboxes href: /pages/public/panels/service_panel_modules#lightboxes - service: title: Slider href: /pages/public/panels/service_panel_modules#slider - service: title: Galleries href: /pages/public/panels/service_panel_modules#galleries # ---------------------------------------------------------------------------- # STEP-BY-STEP Panel # ---------------------------------------------------------------------------- # ---------------------------------------------------------------------------- # home_step_panel # - panel: enabled: false id: home_step_panel type: step_panel style: dark lane_span: fixed cards: - card: title: Marketing & Consulting tagline: > Donec id elit non mi porta gravida at eget metus id elit mi egetine. Fusce dapibus # ---------------------------------------------------------------------------- # NEWS panel # ---------------------------------------------------------------------------- # ---------------------------------------------------------------------------- # home_news_panel # - panel: enabled: true id: home_news_panel type: news_panel style: flat title: Current Articles ยท Most Read tagline: lane_span: fixed boxes: - box: enabled: true type: last_current category: featured - box: enabled: true type: recent category: featured max_posts: 5