• screenshot

    Front page displaying a slideshow of featured content from the source of your choise.

  • screenshot

    Album page displayed in a responsive grid layout.

  • screenshot

    Daily timeline to chronologically view your latest images, videos, albums and essays.

  • screenshot

    Publish essays, writing and show off your portfolio work.

  • screenshot

    Fully compatible with all tablets and smartphones.

  • screenshot

    Optional album cover can also display album title, description, tags and categories.

  • screenshot

    Comes with a simple but elegant login.lens to go with the Password protect plugin.

OxyGen Displays all your Koken content -- albums, sets, images, videos, pages and essays -- and features a wide array of layout and style controls. OxyGen has everything you need to present your work and words online.

Notable features

  • Responsive layout that adapts to all screen sizes and devices.
  • Front page slideshow displaying your content from either: Featured content, Featured albums or Favorites.
  • OxyGen includes three different menu options that can be selected from the settings pane.
  • Essay and pages headers include a banner image of the featured image on that particular page or essay.
  • Essay aside: Optional sidebar that presents related content. Each section can be enabled individually.
  • Essay pagination: At the bottom of each essay are next and previous links for easy navigation between essays.
  • Album covers: Choose from three different headers for your album listing: one plain text and one displaying the cover image of the album or hide it altogether.
  • Image geolocation: A link to a map overlay will be shown if images contain geolocation data.
  • Footers: There are three different footer designs to choose from!
  • Album downloads: OxyGen supports album downloads.
  • Timeline displaying your most recently published images, videos, essays and collections.
  • Tag and category templates for browsing archival content.
  • Custom logo support for site title.
  • Natural swipe navigation for slideshows when viewed on touch-enabled devices like tablets and smartphones.
  • Customizable colors, typefaces and more.

  • All 3.0 theme updates are free.

Technical support for themes and plugins is the responsibility of the item's author. Koken accepts no responsibility for supporting items authored by third parties.

Next: Usage

Usage

OxyGen looks great right out-of-the-box without any customization, but chances are you'll want to adjust its appearance to make it more your style. So, we have include a wide range of editable settings for those who'd like to tweak the theme more to their liking. Like all Koken themes, edits to OxyGen's layout, typography, color and everything else is handled through an integrated settings panel that requires no coding or HTML experience.

Style

OxyGen is white with black text by default, but you can change this how ever you want throughout the the entire theme.

To fine-tune these colors more to your liking, scroll to the bottom of the panel until you reach Color. Editable color swatches are provided here for you to make edits.

Every aspect of OxyGen is customizable via the theme settings panel: If for any reason you need to revert back to the standard white and black, you can do this by selecting "Soft white" from the "Style" dropdown.

Style options

Language

This sets the default language for your public site.

Language option

Site title

Text

The first thing you'll probably want to edit is the title of your site. This is controlled by "Site title", in the settings panel. The title is displayed as text by default, which you can customize by selecting a different typeface or applying different type styles. If you'd like to display an image instead, switch Type to "Image" or "Combi". The panel will update to show options for images (see below).

Site title

Image

Create your logo and upload the image to your web server or any place you can link to, then enter the image's URL in the Image URL field. We recommend using absolute (http://) links, not relative (/) links when assigning a URL. After that you should see your logo in the page.

Combination

This option gives you your logo on the front page: and then switches to a combination of text and logo on the other pages.

Site title combi

Create a smaller version of your logo (works best if this version has a scaling of 1:1), upload it to the same place where you placed the logo.

Then enter the image's URL in to the "Combi URL" field.

Here it's important that you do not use a relative URL: use the absolute (http://) url to the image.

Note: if you leave the "Combi URL" empty, OxyGen will use just your ordinary text Site title".

Navigation

OxyGen comes with four different menu alternatives to choose from!

All are highly customizable down to font size, color, and placement.

Regular

The regular menu is your standard "Fly out" menu style.

Regular menu

Expanded

This is the more traditional way of showing your nav links at the top of the page

Expanded menu

Slide in right/left

Gives you hidden vertical menus which become visible when clicking on the "Menu" icon.

Slide in menu

This option also incorporates support for nested sets.

This is unchecked by default. Set links displays a page which contains the albums and sets inside the set. Check this option, and the behavior will change in that child albums and sets appear underneath the set link in navigation. The child links are offset a bit to distinguish them from other links, which you can edit with the nested indent slider.

Note: When using nested sets, make sure you click "add", next to each album/set inside the set in the "Add links" window. Otherwise the set link won't display any child links.

Nested set in Library

Splash page

OxyGen includes three(!) "Splash" sources for displaying full screen slideshows of featured content. They're intended to be used for the front page of your site to provide visitors with an introductory overview of your best work.

Splash page options

Display your sites tagline on your splash page. OxyGen allows you to show it in three different positions and enables you to customize the appearance. By setting a page ID of one of your pages you can display the text and link to the page.

Tagline options

Featured content

Displays images marked as featured in the Library. Drag/drop images onto "Featured" at the top of the Library's left column to add. This slideshow advances through images when clicked.

Featured albums

Displays albums marked as featured in the Library. Drag public albums from the left or middle columns onto "Featured albums" to add. This slideshow displays a featured album's content when clicked.

Favorites

Displays images marked as favorites in the library. Drag/drop images onto "Favorites" at the top of the Library's left column to add.

To change the slideshow's speed, as well as other slideshow attributes, click the "gear" icon at the top right side of the UI.

Nav arrows

This shows a set of next/previous arrows in the middle of the splash page. If the source contains more than one image, they are hidden automatically.

Auxiliary Links

Shows a set of featured/legal links in the lower right side of the splash page. These links are visible solely on this page.

Essays

Essay sidebar

OxyGen now comes with a fully customizable sidebar that displays related tags, categories, topics, featured and recent essays. <br>All of the different parts can be disabled at will through the theme settings panel.

Essay navigation

At the bottom of each essay you will also find a navigation bar that displays the previous/next essays title, excerpt and featured img. <br>As usual with OxyGen You are in charge of what you want to display here too!

Timeline

OxyGen comes with a timeline that is fully customizable by you!

New albums

You now have the options to display the output for newly created albums as:

  • As a slideshow
  • As a grid (Default)
  • Cover only

Updated albums

For updated albums you have the options:

  • As a slideshow
  • As a grid (Default)
  • The old way, as a list

Footer

OxyGen comes with three different footer options for you to choose from.

Footer options

The default is to show no footer at all, but you can change this to either "Small footer" or "Big footer"

Small footer

This option gives a minimal footer that displays your contact information and copyright, together with social links, essay's and RSS feed.

Small footer options

The contact info and copyright can be given a "Page Id" that can point to your contact form and a page that contains your copyright information.

Page ID

This page id can be obtained by visiting: Admin->Text->Pages and then click on the page you want to link to. In the upper right corner you will have "Properties" This is where you will see the ID.

Big footer

Here we give you a "full blown corporate style" page footer

You gain all the options from above, plus an extra set of footer links that you can assign in the FOOTER navigation group.

This also gives you further social link options to use such as 500px, Instagram and Pinterest.

Big footer options

Note: The user information for Facebook, Twitter and Google+ is automatically taken from: Admin->Settings->Administrator

If you haven't set anything there, these options will not show on the page.

MISC

Misc options group

Editorial Images

This option is for the admin who wants to use images as "Editorial resources" that will not be included in the Portfolio.

Editorial images settings

These can be images that you want to use as "header banners" or images that are used inside of pages and/or essays.

Enabling this option and giving said images a category set here, will hide them from public view, but they will still be seen in the pages or essays.

PhotoSwipe Integration

The excellent PhotoSwipe plugin from Daniel Mullner has the option to show both a simple as well as a more complex caption when viewing images.

PhotoSwipe settings

Here, you can choose to enable this, without the need to edit a .lens file yourself.

OxyGen Server Side Includes

You can now use Server Side Includes inside pages of OxyGen, this option can be enabled at the bottom of the theme settings panel "Misc".

OxyGen SSI

With this option enabled you will be able to insert:

<div oxygen-include="/custom_inc/custom_file.html"></div>

where the custom_file.html can contain any code that you would have included in the page: i.e. a poll or similar.

Insert custom code dialog

Summary

Those are all the major settings you'll find in OxyGen, but there are plenty more to show/hide page elements, crop images, assign lightbox links and more. If you have any questions about the theme feel free to contact OxyGen support.

When you do publish your site, consider sharing it with us! We might include it on this page for others to check out. Simply click on "Examples" in the sub-navigation above and look for the share link box.

Next: Credits

Development

  • Bjarne Varöystrand
  • Christopher Bayer

Proof reading and test pilot

  • Douglas Bain

Bug hunting and testing

  • Mike Costello
  • Daniel Muller
  • Michael Kuhlmann
  • Christian Muellner
  • Ingmar Wein
  • Patrick Visser
  • Grímur Guðmundsson
  • Anki Sandinge

Translations

  • Icelandic: Grímur Guðmundsson
  • Dutch: Ilco Everraert and Toine Repiuk
  • French: Sylvain Deloux
  • German: Gerd Rösser
  • Greek: Nick
  • Polish: Marek Durajczyk
  • Russian: Anna Ozeritskaya
  • Hungarian: Béla Nagy

The original norma design

  • Credit goes to John Elgenstierna for ideas and initial design of norma that we forked.

Version 3.2.1 Released 3 weeks ago

  • [FIXED] The close icon was missing in the Show/Hide discussions

Version 3.2.0 Released 1 month ago

  • [NEW] EXIF Information can now be shown in albums, content and favorites
  • [NEW] Full support for the new Ratings plugin
  • [FIXED] Social share options overlapped "Show comments" in essays
  • [FIXED] The login "password toggle" did not change icon
  • [FIXED] Image name bottom was broken, and can now be displayed as intended again.
  • [UPDATED] License on content pages is now linked to the page set in the footer info
  • [UPDATED] The temporary Cart fix got its own switch in the theme settings panel
  • [UPDATED] Album and image titles are now displayed if no mouse is detected

Version 3.1.9 Released 2 months ago

  • [NEW] Tagline can now be displayed on the front page
  • [FIXED] Images are now scaled down correctly if Essay Aside is active
  • [UPDATED] More fine grained control over what EXIF / IPTC info that is shown
  • [UPDATED] You can now set the EXIF icons color opacity
  • [UPDATED] Essay aside can now show the latest essays
  • [UPDATED] FontAwesome is now optional

Version 3.1.8 Released 3 months ago

  • [NEW] Support for Greek language was added
  • [NEW] Essays excerpts can now be shown on the essays.lens
  • [NEW] EXIF icons can now be given any color via the theme settings panel
  • [FIXED] The login template now get's the helper class .k-lens-kogin assigned
  • [FIXED] Download icon will no longer be shown if the content is from Vimeo
  • [UPDATED] The German language was updated
  • [UPDATED] The EXIF Camera maker was hidden by default, but can be enabled via custom CSS if needed
  • [UPDATED] EXIF icons was optimized and are now more suited as icons.
  • [UPDATED] We now recognize if it's a Video or a photography shown in content, and writes the correct title

Version 3.1.7 Released 4 months ago

  • [UPDATED] Uploads & Community Center was removed
  • [UPDATED] The "scroll to top arrow" now inherits the text color from the menu items

Version 3.1.6 Released 4 months ago

  • [FIX] In some cases the container for forms and disqussions got the wrong width
  • [UPDATED] Disqussions are rendered better when enabled in albums.

Version 3.1.5 Released 4 months ago

  • [FIXED] Album covers, logo & menu opacity was set to 0 in the CSS without possibility to change it

Version 3.1.3 Released 5 months ago

  • [NEW] We now recognize if the content is imported from Vimeo or Instagram, and then showing a link to the original source
  • [FIXED] Fixed an issue where the site title didn't listen to it's position property
  • [FIXED] error.lens the error message was not properly centered on the page
  • [FIXED] Fixed an issue in IE, where the dropshadow of the featured image would show in the essays listing.
  • [FIXED] Lightbox: An issue when using the white lightbox, the text would also be white!
  • [FIXED] An issue where the photo/video info would overlap the social icons
  • [UPDATED] Lightbox can now have any background color
  • [UPDATED] Lightbox color options is only shown when the black lightbox is active
  • [UPDATED] OxyGenModal now makes sure background can't be scrolled
  • [UPDATED] External links icon got a more discrete color, to better blend in with the rest of the page
  • [UPDATED] Moved the estimated reading time above the social sharing icons
  • [UPDATED] Various language related fixes
  • [UPDATED] Tags & categories: added check to see if album summary & content caption is empty: if it is we don't print them
  • [UPDATED] Bumping version required since Hungarian was introduced in 22.3

Version 3.1.4 Released 5 months ago

  • [NEW] Prepared for Koken Store.
  • [FIXED] Timeline: An issue where the updated album in timeline would be empty
  • [FIXED] Fixed an issue where visitors on iOS devices could not open up images in lightbox, if the cart is active
  • [UPDATED] Tweaked the hover behavior on touch devices in image grid