Umbraco Accelerator - Powered by Arlanet

Umbraco Accelerator - Powered by Arlanet

This kitchen sink - a collection of many of the out-of-the-box blocks - has been built on the newest version of Umbraco.

Faster time to market due to out of the box functionalities

With the Umbraco Accelerator by Arlanet you will start your project with a complete set of often used blocks and functionalities that will help you reduce your time to market.

Umbraco Accelerator


The Umbraco Accelerator has been built on top of the popular Umbraco CMS. This page serves as a kitchen sink and is a simple showcase of its diversity and simplicity. This website uses the Umbraco Accelerator.

Headers


The Umbraco Accelerator gives access to multiple headers and text formatting, including alignment and whitespace for creative editors.

H1 Header Left

H1 Header Center

H1 Header Right

H2 Header Left

H2 Header Center

H2 Header Right

H3 Header Left

H3 Header Center

H3 Header Right

Buttons


The buttons can be configured on both color set and alignment based on the web styleguide which has been created. This row has a full column witdth with a diagonal line on top.

Background images and banners

With the option to fix its position (Parallax scroll effect). This text and its header can also be aligned left or centered, now it is aligned on the right. It can also be aligned top or bottom, now it is aligned centered vertical.

The row has been configured to have no spacing.

Clickable Cards


These cards are fully clickable, not partially as some of the other cards which are featured. This text is centered.

Icon Cards


Icon cards work best when they are used with SVG icons. These icons can scale indefinitely on higher resolution screens. Use these cards to create focussed content.

Standard Icon Card
Without additional styling

Standard Icon Card

This version has an icon, title, subtitle, text and clickable button. The card itself is not clickable.

Icon card background color
We have selected grey this time

Icon card background color

Combine different color sets from the web styleguide to create the best cards.

Icon card without button
The attributes are optional

Icon card without button

Only use the attributes you need and the card will style itself accordingly. No button needed here.


Video Cards


Video Cards can be used to act as a teaser or placeholder for a video. You can use this for Youtube, Vimeo or local MP4 files and additionally use images as a starting overlay. Above is a separator with a faded line.

Video card with background color

Video card with background color

This block has a grey background and no subtitle. But it does have a button.

Video Card without button
Use the attributes you need

Video Card without button

Each card will remain responsive and styled, no matter the attributes which are used.

Standaard Video Card
This card has default settings

Standaard Video Card

All attributes have been set in this card.

Image Cards


The Image Card is the most often used card as it can be used in a lot of different content layouts. Create your own overviews and make one of the cards stand out; the options are limitless.

Standard Image Card
No additional settings

Standard Image Card

This is the default version without a button.

Blended Image Card

Blended Image Card

Setting the card color to the background makes it blend in with the row and separates the images from the text.

Less is more

Less is more

Let your Image Card stand out using the primary color of your set and just add some text.

Youtube Video's


Apart from the Video Cards you can still use the Youtube Video component. Just select the Youtube link, paste it into the block and the component will be set automatically.

You can also set the initial image before loading the video.


Quote


This block can be used for client cases and testimonials to add quotes to your marketing story. There are also some attributes you can set, such as a profile photo and a link. There is also an Arlanet blue separator line above.

 

Paul de Metter

I really like the way the Umbraco Accelerator works and gives me the opportunity to create content without limits.

Links


Apart from buttons and cards, you can also link to other content sections or external websites using the Link component. It will set the appropriate SEO settings depending on the attributes selected. You can also use icons to use the component as a download block.

Google Maps


Google Maps can be used as a block and has different settings in the way it can be used:

  • Place
  • Search result
  • Route description
  • Streetview or custom panorama
  • Area

Separated content

In the accordion you can separate content using different tabs.



As you can see there are different tabs with titles and content.



You can add as many tabs as you wish, as long as you keep the user experience in mind.



The vertical tab block will have the same options as the accordion, but will show the content instantly.

You are allowed to use the "Rich Text Editor" which enables the editor to use text formatting when creating  content.

Content can also be created using tables You can create dynamic tables in Umbraco This is ideal for showing structured (product) data
While creating the table you don't have to worry about styling All tables are converted to a responsive version for mobile devices So you can go ahead just thinking about the content
You can leave cells empty alternate rows have a distinctive color

Call +31 75 - 647 60 90 or book an appointment.

Yes, even this call to action is created using different blocks!

DRIVING DIGITAL /FORWARD