# Milk Theme for phpBB 3.1

Installation & Configuration documentation

## Contents

1. Installation
2. Theme Options
   - Logo Settings
   - Header Background Settings
   - Header Structure Options
   - Sidebar Settings
   - Social Bar Settings
   - Footer Content Settings
3. Misc. Settings
   - Theme Accent Colour
   - Navbar Colour
   - Scroll to Top Button
   - Collapsible Categories
   - Topic Creation Time on ViewForum
   - PostProfile Side
   - Joined date on ViewTopic
4. Support
5. Changelog

- Item Name : Milk
- Theme Version : 1.0.2
- phpBB Version : 3.1.9, 3.1.10+
- Author : PlanetStyles
- Support via Email : missioncontrol@planetstyles.net

Thanks for buying the Milk Theme - we think you made a great choice. This documentation should cover everything you need to install and configure the Theme for your forum. If you need any extra help, find a bug, or would like to submit a feature request, please feel free to contact us - we're very friendly :)

- PlanetStyles Team

## How to Install Milk Theme #back to top

#### Setup Information

The Milk Theme requires our free FlightDeck Extension in order to configure the theme options (included in download). Therefore there are 2 parts to the installation process:

1. Install & enable the required extension ("FlightDeck")
2. Install & enable the Milk Theme

Note: We offer an affordable installation service for customers wanting help installing the Milk Theme. Email missioncontrol@planetstyles.net for more info.

#### How to install the FlightDeck extension

##### Uploading the extension files

1. Download Milk Theme
2. Locate folder "milk.zip" and extract to your desktop
3. Open folder "2. Extension Files"
4. Using either FTP or a File Manager, upload the "planetstyles" folder to: /yourdomain.com/phpBB/ext/

##### Enabling the extension

1. Navigate to: ACP (Admin Control Panel) → "Customise" (tab)
2. Below "Disabled Extensions", locate: "PlanetStyles Flight Deck"
3. Click "Enable" and confirm
4. Important: Browse to ACP Home and click "Run Now" next to "Purge Cache". (This is necessary to allow colour picker to function correctly).

#### How to install the Milk Theme

##### Uploading the Theme Files

1. Download Milk Theme
2. Locate folder "milk.zip" and extract to your desktop
3. Open folder "1. Theme Files"
4. Using either FTP or a File Manager, upload the "milk" folder to: /yourdomain.com/phpBB/styles/

##### Enabling the Theme

1. Navigate to: ACP (Admin Control Panel) → "Customise" (tab)
2. In the left sidebar, click "Install Styles"
3. Locate: "Milk"
4. Click "Install style" and confirm

##### Set Milk as default style

1. Navigate to: ACP (Admin Control Panel) → "General" (tab)
2. In the left sidebar, click "Board Settings"
3. Change "Default Style" to "Milk"
4. Navigate to: ACP (Admin Control Panel) → Customise (tab)
5. In the left sidebar, click "Styles"
6. Optional: Deactivate any other styles to move existing users on other styles onto the Milk Theme

## Configuring Theme Options #back to top

The following sections outline the configurable options in the Milk Theme.

All options are configured in: ACP (Admin Panel) → Extensions (tab) → Flight Deck (Control Panel) → Theme Settings

## Logo settings #back to top

#### Uploading a logo - #back to top

1. Open FlightDeck Extension (Control Panel)
2. Next to "Logo image upload" , click "Browse"
3. Select your logo file from your computer
4. If changing a logo, ensure the "logo location" filed is empty
5. Optional: Enter height and width
   Tip: Set the height & width to 50% of your logo's actual size to ensure a crisp display on retina devices.
6. Click Submit

#### Revert to the default logo - #back to top

1. Open FlightDeck Extension (Control Panel)
2. Empty the value from the "Logo location" field
3. Click Submit

#### Removing the logo - #back to top

1. Open FlightDeck Extension (Control Panel)
2. Set "Header Structure" option to "Text Only"
3. Click Submit

## Header settings #back to top

#### Uploading a header - #back to top

1. Open FlightDeck Extension (Control Panel)
2. Next to "Header background upload" , click "Browse"
3. Select your header image file from your computer
4. If changing a header, ensure the "header location" filed is empty
5. Optional: Set background size / position / repeat properties in the options below.
6. Click Submit

#### Header Size / Repeat / Position Options - #back to top

These Options can be found by scrolling down, under "Style Options"

1. Background Repeat: Defines which direction the background image repeats. Options:
   - repeat-x: left &right
   - repeat-y: up & down
   - repeat: left & right & up & down
   - no-repeat: Header doesn't repeat
2. Background Position: Defines the background image's starting position.
3. Header Tint: Applies a transparent dark layer over the header background. Useful for bright backgrounds.
4. Stretch header to fill space? : If using a non-repeating background, this option can be used for stretching the background image to fill the header space.

#### Revert to the default header (theme accent colour) - #back to top

1. Open FlightDeck Extension (Control Panel)
2. Empty the value from the "Header image location" field
3. Click Submit

## Header Structure Options #back to top

There are 3 header options to choose from.

#### Logo Only

#### Text Only

#### Logo and Text

#### Setting header structure - #back to top

1. Open FlightDeck Extension (Control Panel)
2. Set "Header Structure" option to either:
   - Logo Only
   - Text Only
   - Logo and Text
3. Click Submit

## Sidebar Settings

The sidebar is fixed at 300px wide

#### Enable the Sidebar - #back to top

1. Open FlightDeck Extension (Control Panel)
2. Set "Enable right Sidebar" to "Yes"
3. Click Submit

#### Edit Sidebar Content - #back to top

1. Open FlightDeck Extension (Control Panel)
2. Enter sidebar content in "Custom HTML code block #1" textarea.
   Tip: HTML markup is supported.
3. Click Submit

#### Sidebar HTML Examples - #back to top

##### Content Box:

    <div class="stats-block">
        <div class="inner">
            <ul class="topiclist">
                <li class="sidebar-header">
                    <span class="fa fa-info-circle"></span>&nbsp;&nbsp;Block Title
                </li>
            </ul>
            <ul class="topiclist forums">
                <li class="row">
                    Box content
                </li>
            </ul>
        </div>
    </div>

##### 125px x 125px Ad Grid:

    <div class="sidebar-grid cf">
        <a href="#"><img src="./styles/milk/theme/images/sidebar/1.jpg" width="125" height="125" alt="" /></a>
        <a href="#"><img src="./styles/milk/theme/images/sidebar/2.jpg" width="125" height="125" alt="" /></a>
        <a href="#"><img src="./styles/milk/theme/images/sidebar/3.jpg" width="125" height="125" alt="" /></a>
        <a href="#"><img src="./styles/milk/theme/images/sidebar/4.jpg" width="125" height="125" alt="" /></a>
    </div>

## Social Bar Settings

#### Enable the Social Bar - #back to top

1. Open FlightDeck Extension (Control Panel)
2. Set "Enable Social Bar" to "Yes"
3. Click Submit

#### Adding Social Icons - #back to top

The Social Icons are powered by FontAwesome library.

1. Open FlightDeck Extension (Control Panel)
2. Enter Social Bar content in "Custom HTML code block #2" textarea, using the following format:

       <a href="#"><span class="fa fa-twitter"></span></a>
       <a href="#"><span class="fa fa-apple"></span></a>
       <a href="#"><span class="fa fa-facebook"></span></a>
       <a href="#"><span class="fa fa-codepen"></span></a>
       <a href="#"><span class="fa fa-google"></span></a>
       <a href="#"><span class="fa fa-digg"></span></a>
       <a href="#"><span class="fa fa-pinterest-p"></span></a>

3. Refer to FontAwesome.com/icons/ for a full list of supported icons
4. Click Submit

## Footer Content Settings #back to top

There are 2 footer content sections.

#### Editing Footer Content - #back to top

1. Open FlightDeck Extension (Control Panel)
2. Enter footer content in either of the following textareas:
   - Bottom-left: Custom HTML code block #3
   - Bottom-center: Custom HTML code block #4
3. Click Submit

##### Sample Code:

    <h3>About Us</h3>
        <p><a href="http://www.planetstyles.net"><img src="./styles/milk/theme/images/horizontal-logo-transparent.png" height="50" /></a></p>
        <p>Hi! We're PlanetStyles, and we make premium forum themes for phpBB. Check out <a href="http://themeforest.net/user/PlanetStyles/portfolio?ref=PlanetStyles">our portfolio</a>, or visit <a href="http://www.planetstyles.net">our website</a> and say hi!</p>
        <p>This section can be replaced with anything you like!</p>

##### Sample Code:

    <h3>Contact Us</h3>
        <ul class="fa-ul">
            <li><span class="fa fa-phone"></span> +44 0123-456-789</li>
            <li><span class="fa fa-map-marker"></span> Your address</li>
            <li><span class="fa fa-envelope"></span> your.email@yourdomain.com</li>
            <li><br /><span class="fa fa-twitter"></span> @twitter_handle
        </ul>

    <br />

    <p>You can enter any content here.</p>

## Misc. Settings #back to top

#### Theme Accent Colour

Sets the default accent colour that will be shown to all end users.

#### Setting Theme Accent Colour - #back to top

1. Open FlightDeck Extension (Control Panel)
2. Use Colour Picker to choose colour. Note: If colour picker doesn't expend, ensure JavaScript is enabled and try purging phpBB's cache (ACP front page button).
3. Click Submit

#### Navbar Colour

Dark

Light

Transparent

#### Setting Navbar Colour - #back to top

1. Open FlightDeck Extension (Control Panel)
2. Set "Navbar Colour" option to either:
   - Dark
   - Light
   - Transparent
3. Click Submit

#### Scroll to Top Button

Adds a "scroll to top" button in the lower-right corner on long pages.

#### Enabling Scroll to Top Button - #back to top

1. Open FlightDeck Extension (Control Panel)
2. Set "Enable Scroll to Top" option to either:
   - Yes
   - No
3. Click Submit

#### Collapsible Categories

Adds a switch to forum categories allowing the end user to show / hide specific categories as per their preferance. The user's choice is stored in their browser.

#### Enabling Collapsible Panels - #back to top

1. Open FlightDeck Extension (Control Panel)
2. Set "Enable Collapsible Panels" option to either:
   - Yes
   - No
3. Click Submit

#### Topic Creation Time on ViewForum

The Milk Theme hides the topic creation time on viewforum.php to declutter the space. This option allows you to return it.

#### Enabling Topic Creation Time on ViewForum - #back to top

1. Open FlightDeck Extension (Control Panel)
2. Set "topic creation time on viewforum" option to either:
   - Yes
   - No
3. Click Submit

#### Postprofile Side

'Postprofile' is the section of topic replies that contains the poster's avatar, post count and other poser-specific information. You can choose to display this information on the left or right side of the post.

Left

Right

#### Setting Postprofile side - #back to top

1. Open FlightDeck Extension (Control Panel)
2. Set "Postprofile Side" option to either:
   - Left
   - Right
3. Click Submit

#### User 'Joined' date on ViewTopic

The Milk Theme hides the user's joined date on viewtopic.php to declutter the space. This option allows you to return it.

#### Enabling Joined date on ViewTopic - #back to top

1. Open FlightDeck Extension (Control Panel)
2. Set "User 'Joined' date on viewtopic" option to either:
   - Yes
   - No
3. Click Submit

## Help & Support #back to top

We provide help & support to all PlanetStyles Customers with an active support grant.

Please visit our Support Page or email missioncontrol@planetstyles.net

Support for our items includes:

- * Responding to questions or problems regarding the item and its features
- * Fixing bugs and reported issues
- * Providing updates to ensure compatibility with new software versions

Regrettably can't freely assist with the following, however we do offer an affordable service for the following:

- * Customisation and installation services
- * Support for third party software and plug-ins

Please email us for a quote if you would like us to assist with Installation or Customisation.

## Version History (Changelog) #back to top

#### Changelog

    						-----------------------------------------------------------------------------------------
    						Version 1.0.2 - October 17th, 2016
    						-----------------------------------------------------------------------------------------

                            - [ADD] phpBB 3.1.10 Compatibility

                            - [CHANGE] Removed unchanged template files that are inherited from prosilver

                            - [FIX] Highlighted text was became invisible in Firefox

    						-----------------------------------------------------------------------------------------
    						Version 1.0.1.1 - October 1st, 2016
    						-----------------------------------------------------------------------------------------

                            - [FIX] Scale logo in responsive layout
                            - [FIX] Accent colour broken in Firefox

    						-----------------------------------------------------------------------------------------
    						Version 1.0.1 - September 26th, 2016
    						-----------------------------------------------------------------------------------------

    						- [ADD] Feature: Upload header background + options for setting position / repeat
                            - [ADD] Feature: Header Tint
                            - [ADD] Feature: Set accent colour by HEX code / colour picker
                            - [ADD] Feature: High contrast footer links
                            - [ADD] Feature: Set Forum width (px or %)
                            - [ADD] Option: Transparent Navbar Background

                            - [CHANGE] Footer Structure

                            - [FIX] Logo was hidden in responsive mode

    						-----------------------------------------------------------------------------------------
    						Version 1.0.0 - May 28th, 2016
    						-----------------------------------------------------------------------------------------

    						- Initial Release