You are here

Logistics Technology : at_headliner settings

Status message

You are viewing the at_headliner settings for Logistics Technology.

Layout & General Settings

Vertical Tabs

Standard Layout

Standard Layout

The standard layout is for desktops, laptops and other large screen devices.

Choose sidebar layout
Set sidebar widths
Set the width of each sidebar
Set the page width
Set the page width
Set a max width
Standard Screen Media Queries
Do not include @media, it's included automatically.
Tablet Layout

Tablet Layout

Tablet devices such as iPad have two orientations - landscape and portrait. You can configure a different layout for each orientation.

Landscape

Landscape tablet

Choose sidebar layout
Set sidebar widths
Set the width of each sidebar
In this layout Second sidebar wraps below.
Set the page width
Set the page width
Tablet Landscape Media Queries
Do not include @media, it's included automatically.
Portrait

Portrait tablet

Choose sidebar layout
Set sidebar widths
Set the width of each sidebar
In this layout Second sidebar wraps below.
Set the page width
Set the page width
Tablet Portrait Media Queries
Do not include @media, it's included automatically.
Smartphone Layout

Smartphone Layout

Smartphone devices such as iPhone, Android and Windows phones have two orientations - landscape and portrait. You can configure a layout for landscape orientation only - portrait orientation always displays in one column with sidebars stacked below the main content.

Landscape

Landscape smartphone

Choose sidebar layout
Set sidebar widths
Set the width of each sidebar
Smartphone Landscape Media Queries
Do not include @media, it's included automatically.
Portrait

Portrait smartphone

One column

The smartphone portrait layout always displays in one column with sidebars stacked horizontally below the main content. All widths are always 100%.

Smartphone Portrait Media Queries
Do not include @media, it's included automatically.
Panels & Gpanels

Panels & Gpanels

Adaptivetheme supports responsive Panels and Gpanel layouts. To use this capability you can use the Panels module, Display Suite (with Panels) or Adaptivethemes native Gpanels layouts. To views all layouts on one page and test your settings you can enable the panels test, see the Debuggers tab.

Usage: select options for each device range and layout type.

Your theme currently uses these Gpanels:

  • AT Two column 66/33
  • AT Two column 50/50
  • AT Three column 3x33
  • AT Four column 4x25
CSS

CSS Global Settings

These settings are primarly set during development - do not change these unless you are actively developing or modifying your theme. If you need to globally unset core CSS or other CSS files use the Unset CSS Files extension.

CSS Mode

Mode

CSS aggregation is ON. Changes to your themes responsive CSS files will not show until you re-save the theme settings (click "Save configuration" at the bottom of this form).

This is required to re-write the production version of the responsive styles and is a performance optimization in Adaptivetheme, which saves your site at least 4 HTTP requests.

Custom Media Queries

Custom Media Queries

Use this file if you need to use custom media queries, such as overlapped media queries. This file is located here: themeName/css/responsive.custom.css. Adaptivetheme will load this file automagically when this setting enabled.
Mobile first or Mobile last

Mobile first or Desktop first

Use with caution! If you are using a pre-styled sub-theme such as Pixture Reloaded, Sky, Corolla, AT Commerce or any of the commerical sub-themes you should NOT change this!
Change default layout method

Adaptivetheme supports both mobile first and desktop first design approaches. Please review the online documentation.

This setting fundementally alters what CSS is loaded and how it is loaded. At the most basic level if you select Mobile first the Smartphone portrait layout will load as the default, if you select Desktop first the Standard layout will load as the default. Many other changes take place regarding loading of CSS for Internet Explorer, Responsive Gpanels and Panels as well.

Path to Generated Files

Path to Generated Files

Files will be saved to: sites/default/files/adaptivetheme/at_headliner_files/
Files will be saved to: sites/all/themes/at_headliner/generated_files/
This directory must exist and be writable by Drupal. This directory must be relative to the Drupal installation directory and be accessible over the web. Do not try to use something like ../css, it will fail. Use someting like sites/default/css.
Disable Responsive CSS

Disable Responsive CSS

By checking this setting the site will use only the Standard layout and the global styles. You can turn this back on at any time.
Polyfills

Polyfills

Here you can enable commonly used Polyfills supplied with the core theme. Adaptivetheme also supports loading scripts and CSS for Internet Explorer using your sub-themes info file.

Polyfills
By checking this setting the site will load the html5shiv. Turning this off will be bad news for IE6-8.
Load the JS Media Queries plugin to enable responsive JavaScript. See /at_headliner/scripts/media_queries.js for instructions on how to use. This is an alternative to using matchMedia and hard coding breakpoints in JavaScript. This is bleeding edge and must be considered beta, but its wickedly cool, and useful.
Load a stylesheet that fixes percentage rounding errors in IE6-7. You need this if you are using Gpanels or Panels layouts.
By checking this setting IE6, 7 and 8 will rely on respond.js to set the layout.
Fixes the iOS Orientationchange zoom bug.
Metatags

Mobile Metatags

Configure metatags for mobile devices. To omit a metatag leave it empty.

Mobile Metatags
Debuggers
Debuggers

Debuggers

Debug Panels and Gpanels Layouts

Debug Panels and Gpanels Layouts

This will only load the layouts that ship with AT Core, the test is hard coded.

All Media Queries

All Media Queries

This shows the media queries currently being used by your theme. This is provided so you can easily save a backup copy for reference.

Standard layout
@media only screen and (min-width:1025px)
Tablet landscape
@media only screen and (min-width:769px) and (max-width:1024px)
Tablet portrait
@media only screen and (min-width:481px) and (max-width:768px)
Smartphone landscape
@media only screen and (min-width:321px) and (max-width:480px)
Smartphone portrait
@media only screen and (max-width:320px)
Extensions

Enable Additional Features

Extensions include many extras for configuring and styling your site. Enabled extensions will appear in new vertical tabs below the main setting. Extensions can be enabled or disabled individually, so you only load what you need. Disabling the global setting will globally disable most extensions, but not enable them.

Once you have enabled an extension you will need to configure its settings, then save the theme settings again (to save its configuration).

Extensions
Apply fonts to site elements (page, titles, headings, menus and custom selectors). Supports websafe, custom and Google fonts, and @font-your-face integration.
Fine grain control over case, weight, alignment and CSS3 text shadows for page title, node, comment and block titles.
Set default image alignment, image captions and teaser image view.
Check this setting if you want to use touch icons for iOS, Android and Nokia devices.
Options to unset (exclude) CSS files from loading in your theme - includes settings for Core modules, CSS added by Libaries and your own declared exclusions (see your themes info file under "Stylesheets").
Enter custom CSS rules for minor adjustment to your theme. Useful if you do not want to build a sub-theme and need modifications to survive theme upgrades if required.
Unset regions or move blocks to another region in mobile devices. Requires the Browscap module for mobile device detection.
Float blocks in any region - this allows blocks to line up horizontally within a region, similar to a CSS grid or columns.
Many additional options for adding, removing, hiding and changing site elements and markup - includes:
  • Set the gutter width
  • Use page--full-width-wrappers.tpl.php for 100% width header and footer designs
  • Enable page--[content-type].tpl.php suggestions
  • Wrap menu item text in SPAN tags
  • Breadcrumb Settings - hide, hide the home link, configure seperator, append the page title
  • Login Block - hide links, hide OpenID links, horizontal login block
  • Remove the frontpage title
  • Do not display the Main content block on the front page
  • Remove RSS feed icons
  • Hide comment titles
  • Remove menu link titles (tool tips)
  • Accessibility settings - set the skip navigation target ID, use extra fieldsets in the advanced search form
  • Add rel=author to user names
  • Add or remove CSS classes for pages, nodes, blocks, comments, menus and item lists

Vertical Tabs

Fonts

Fonts

First select the font type — websafe, google or custom — then select or enter the required information depending on the type. Adaptivetheme can also support any font supplied by the @font-your-face module, new settings and instructions will appear after you have installed @font-your-face.

To preview and gather required information for adding Google fonts see: google.com/webfonts. If you are adding extra styles or character sets these must exist for the specified font — use the Quick-use feature in Google fonts to check this information.

Default font
Paste the Google font name, e.g. Open Sans Condensed. Only add one font.
Add Google Font Styles
Add Google Font Character Sets
Enter a comma seperated list of fonts, with no trailing comma. Names with spaces should be wrapped in single quotes, for example 'Times New Roman'.
The default font size is set on the HTML element. All elements, margins, padding and widths using a relative unit such as em or % will scale relative to this value. Use "Not set" if you prefer to set this in your CSS. You can override this value in your responsive stylesheets also, to use a larger or smaller default size for different device types.
Title Styles

Title Styles

Add extra styles to headings. Text shadows only work for CSS3 capable browsers such as Firefox, Safari, IE9 etc.

Site name
Site name
Site slogan
Site slogan
Page title
Page title
Node title
Node title
Comment title
Comment title
Block title
Block title
Image Settings

Image Settings

Set alignment for image-field images on full and teaser view, and enable captions.

Image Alignment
This will only affect images added using an image-field. If you use another method such as embedding images directly into text areas this will not affect those images.
Image Captions
Display the image title as a caption
Captions use the title attribute text. You must enable tiles in the field management options for your image fields.
Teaser Image Fields
Show only one image field image on teasers
Useful for when you have a multivalue image field and you only want the first image to show on teasers.
Page Styles
This setting adds a texture or pattern over the main background color.
Header layout
Change the position of the logo, site name and slogan. Note that his will automatically alter the header region layout also. If the branding elements are centered the header region will center below them, otherwise the header region will float in the opposite direction.
Menu Bullets
Change the default menu bullets.
Float Region Blocks

Float Region Blocks

Select number of columns(i) for each region. For example if you want four blocks to line horizontally up choose 4, then select the float direction. Clearing(ii) (if you are trying to create a grid) and mobile displays(iii) must be accounted for in your theme.

  1. This will not create real columns, it merely sets a width on each block in the region. For example if you select 4, each block will be 25% wide, if you then add a fifth block to that region it will wrap below the other four, and so on.
  2. There is no automagical clearing for uneven height blocks, so be weary of trying to create a grid with this. If you need real columns use a Gpanel or the Panels module.
  3. See responsive.custom.css in your theme for an example of how to control blocks in mobile displays.
Options for the Sidebar first region
Options for the Sidebar second region
Options for the AT Two column 66/33 - top region
Options for the AT Two column 66/33 - left region
Options for the AT Two column 66/33 - right region
Options for the AT Two column 66/33 - bottom region
Options for the AT Two column 50/50 - top region
Options for the AT Two column 50/50 - left region
Options for the AT Two column 50/50 - right region
Options for the AT Two column 50/50 - bottom region
Options for the Secondary Panel region
Options for the Header region
Options for the Menu Bar Top region
Options for the Menu Bar region
Options for the Sub Menu Bar region
Options for the Help region
Options for the Highlighted (Content top) region
Options for the AT Four column 4x25 - 1 region
Options for the AT Four column 4x25 - 2 region
Options for the AT Four column 4x25 - 3 region
Options for the AT Four column 4x25 - 4 region
Options for the Tertiary Panel region
Options for the AT Three column 3x33 - top region
Options for the AT Three column 3x33 - left region
Options for the AT Three column 3x33 - center region
Options for the AT Three column 3x33 - right region
Options for the AT Three column 3x33 - bottom region
Markup Overrides
Design

Design

px
Gutters are set using margin-left and margin-right. This will override the default 10px margins set in global.page.css.
This setting will load a page template will full width DIV wrappers - perfect for designs with 100% width sections, header or footer. Note that if you choose to use other page template suggestions you should use copies of page--full-width-wrappers.tpl.php, you will find this in adaptivetheme/at-core/templates.
If the node type is "blog" the template suggestion will be "page--blog.tpl.php". The content type suggestions are weak and can be overridden by single page--node.tpl.php template or standard page--node-[nid] templates.
Note: this does not work for Superfish menus, which includes its own feature for doing this.
Breadcrumbs

Breadcrumb Settings

Breadcrumbs
Text, basic markup and html entities only. Dont forget to include spaces.
Hide or Remove

Hide or Remove

Checking this setting will remove the page title from the front page, for example if you set a node to be the front page content you may want to hide the title.
Checking this setting will remove the Main content block from the front page only - useful for removing the welcome message and allowing use of another block.
Checking this setting will remove RSS feed icons. This will not affect the Syndicate block icon.
Checking this setting will hide comment titles using element-invisible. Hiding rather than removing titles maintains accessibility and semantic structure while not showing titles to sighted users.
Checking this setting will remove all menu link titles (tool tips). This only works for menu blocks.
Accessibility

Accessibility

The problem with Drupals standard Advanced search form is that each criterion group is wrapped in a DIV, whereas it should use fieldsets. Turning this on may cause issues with modules that modify the search form such as Search Config.
SEO

SEO

Add rel author to user names to support Googles Authorship feature.
Extra Classes

Extra CSS Classes

page-path, add/edit/delete (for workflow states), content type classes, section classes, site name class (useful for multisites) and a language class (i18n)
promoted, sticky, preview, language, odd/even classes, user picture handling, and build mode classes
anonymous, author, viewer, new, odd/even classes and classes for hidden titles, user picture and signature handling
odd/even (zebra classes), block region, delta and block count classes
menu link ID (mlid) and menu level (depth)
first, last and odd/even (zebra classes)
Color scheme

Preview

Lorem ipsum dolor

Sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Header image settings
Choose a graphical header, or upload a custom image.
To have images supplied by your theme show here place them in yourtheme/header-images folder. They must be png or jpg.
Custom image
The path to the file you would like to use as your header.
If you don't have direct file access to the server, use this field to upload your header.
CSS settings
The CSS selector to use when placing the header image.