Documentation

2.1 Theme Installation

1. Login to your Wordpress admin panel. When you logged please navigate to Appearance → Themes . There you will find an overview of your already installed wordpress themes.
2. Click Add New at the top of the themes page. If the next page is loaded please press Upload Theme . A upload will be shown - please press and follow step 3.
3. Please go to the folder where your brooklyn.zip file is located (Attention: please use the zip file - do not extract the files before) The brooklyn zip is included in the files that you have downloaded from Themeforest. Please select the zip file and press Install Now.
4. When brooklyn.zip file is uploaded and installed please click Activate to make sure that the theme will be activated as your used theme in your Wordpress installation.

2.2 Plugin Installation

After activating the theme you will see the notification message on the top of the admin page.

1. Please click Begin Installing Plugins .
2. Please select all the plugins in the list and choose Install from the drop-down menu. If done please click Apply .

2.3 Theme Update

There are a couple of ways to update the Brooklyn Wordpress Theme to the latest version:

But before you update: Let's do a backup of your theme.

Backup the current version of the theme. To create a backup of your theme we highly recommend to install and use the "UpdraftPlus WordPress Backup Plugin".

1. Navigate to Plugins → Add new
2. Search "UpdraftPlus WordPress Backup Plugin" (Screenshot below)
3. Install and activate the plugin
4. Navigate to Settings → UpdraftPlus Backups
5. Click Backup Now

To restore the theme and system to the latest backup, please click Restore and follow the steps in the description.

Method 1: Update Through Wordpress Admin Panel

For this method you should first install and activate "Easy Theme and Plugin Upgrades" Plugin. Unzip the file you just downloaded from ThemeForest and locate the WordPress Theme (brooklyn.zip).

1. Navigate to Plugins → Add new
2. Search "Easy Theme and Plugin Upgrades" (Screenshot below)
3. Install and activate the plugin
4. Click on Appearance → Themes
5. Still within the Themes section, on header tab, click on Install Themes, then on header second tab click Upload
6. Click Browse… and locate the new theme file (brooklyn.zip)
7. Click Install Now
8. Click Activate

Method 2: Install the WordPress Envato Market plugin

1. Download the Envato Market plugin
2. Navigate to WP Dashboard → Plugins → Add new
3. Upload the Plugin (envato-market.zip)
4. Install and Activate the plugin.
5. Navigate to the Envato Market menu, follow the instructions to generate a Global OAuth Personal Token, and enter the Token in your WordPress Dashboard

Method 3: Manually Install the Update without Plugin

To install a new version of the theme manually:
Unzip the file you just downloaded from ThemeForest and locate the WordPress Theme. (brooklyn.zip)

1. Log into your WordPress Dashboard
2. Click on Appearance → Themes
3. Please now click and activate a standard theme of Wordpress that you will find in the theme overview (e.g. Theme "twenty seventeen")
4. Now choose Brooklyn Theme (theme details) und delete the theme
5. Now please upload the downloaded Brooklyn Theme Update (brooklyn.zip)
6. Once the theme was uploaded please click install and activate the theme

Now you will find the latest version of your theme also in your front end website.
Delete the old version and reinstall the latest version. You will not be able to install the new version while the old version is still installed.

2.4 Theme Translation

To translate the Brooklyn Blog Theme you need the editor Poedit. Please download Poedit here

1. Open Poedit and open File → New from .POT-/.PO-File or choose second point Create New Translation
2. Choose the .POT from Brooklyn Theme. You will find this file in the theme folder: wp-content/themes/brooklyn/lang/brooklyn.pot
3. A window will displayed, where you can choose your language
4. Press "Ok" and Poedit will give file name automatically, e.g.: if you choose "spanish" the file will called es_ES.po, if you choose "german" the file is called de_DE.po
5. Save your created file on your computer
6. Now you can start to translate the theme or plugin. The field on top will show you the text that could be translated. The text which is already translated will be shown on the right. The fields at the bottom will show you the source text, your translation and notes for the translator. Translation is pretty - choose a word or a sentence, put in your translation - done. Go to the next.
   • Take care of special character of the original text you are translating
   • If you want to save time and it is not necessary to translate all strings from the backend dashboard
7. If you have finished your translation please save your file. Poedit will generate a .PO- and a .MO-File. Please upload both files into the language folder of your theme (wp-content/themes/brooklyn/lang).

4.1 Creating a Post

To create a new post, go to Wordpress admin panel and navigate to Posts → Add New .

Once you've set your prefered post format (please see also: Post Types) you can enter your post title and add your content. Remember: Please make sure to assign at least 1 category to your post. You can also add specific tags to your Post.

4.2 Post Types

Brooklyn has the option to create 4 different post formats: standard, gallery, video, and audio

In order to activate these post options, you'll first want to ensure you've installed & activated the required Vafpress Post Formats UI plugin. This Vafpress plugin comes also included with this theme. When you activate Brooklyn for the first time, you should get a banner notification at the top of your dashboard advising you to install specific required & recommended plugins.

Select the format you'd like and want to use for your Post. Each Post option will give you different content input boxes depending on the content you would like to add.

Standard Post

A standard post is the default and standard post type where you can add text and images to your post using the tools and content box.

Gallery Post

A gallery post allows you to create a slideshow-type gallery at the top of your post. After clicking the "Gallery" tab to choose this post format option, click Pick Images within the "Gallery Images" box that has appeared. Select your images you would like to add from your WordPress Media Library (the Media Library will open after click automatically).

Video Post

A video post displays a video at the top of your post. You can share videos from nearly all video hosting sites, such as Vimeo or Youtube. You only need to copy the video URL and paste the url (Video URL, oembed code or embed code) into the special input box. When you preview or publish your post, the video will appear and you will see the video on your video post page.

Audio Post

An audio post allows you to share a music or audio track and displays it at the top of the post. Like in the video post, simply copy & paste the URL of the music track (Audio URL, oembed code or embed code) into the special audio input box. When you preview or publish the post, the track will appear and you will see the audio player on your audio post page.

4.3 Featured Post

You want to feature a post (or more) in the Brookly Theme Blog Page Slider? It is very easy.

In order to feature a post, please navigate to Post Edit page and please set the check button in Blog Page Slider in the Featured Post metabox. You can feature as many posts as you want in Blog Page Slider, but we would recommend an amount of 3 to 5 featured Posts. (See also: Featured Post Slider)

4.4 Layout Options

Each post can be configured individually to show right sidebar or shop sidebar or no sidebar. Please choose the option you want from the select field in the "Layout Settings" metabox. (See also: Sidebar)

4.5 Metas

You may hide certain Post Meta.

1. Go to Wordpress admin panel and navigate to Appearance → Customize
2. Open the Tab Layout → Post Meta

How to add additional meta information about the author:

Each post author is able to add their own social accounts and author info. The author meta information will be displayed below the post content and the author archive page below the header title.

To adjust the author meta information please go to Users → All Users Select the Author add the Author Info and /or the URLs of the Social Accounts. To apply your updated profile and meta information please click Update Profile.

5.1 Creating a Page

To create a new page, go to Wordpress admin panel and navigate to Pages → Add New .

Similar to creating a post, you can enter a page title, add content and assign a featured image.

5.2 Layout Options

Additionally, you have the option to choose between a number of page templates via the drop-down menu on the right titled "Template" [1]:

• Default Template (Boxed Featured Image)
• Full Width Featured Image
• Full Width Headline (Boxed Featured Image; Headline in full width Section on top)

Each page can be adjusted individually to have either right sidebar, right shop sidebar or no sidebar. Please choose the option you want from the select field in the Layout Settings metabox [2]. (See also: Sidebar)

Also you can show the most popular posts at the top or the bottom of your page. You find several options in the "Popular Posts" metabox to adjust like title, position, amount or filter to adjust the information to your needs [3].

5.3 Meta: Share Buttons

If you want to hide the Share Buttons of the Page Content.

1. Go to Wordpress admin panel and navigate to Appearance → Customize
2. Open the Tab Layout → Post Meta
3. Move the Toggle Share Buttons Page Content to the left

6.1 Creating a Category Page

Attention: Creating a Category Page is different to creating a static page (described on Creating a Page)

A category page is a dynamic page that summarize all your posts assigned with a specific category (e.g.: Category "Travel" - all published posts that are assigned to the Travel category will be shown on Travel category page).

A category page is generated by WordPress after adding a category to a post (See also: Creating a Post). It will not automatically appear as a menu item in your navigation menu. To give visitors an easy access to your category pages, you can add the category page to your menu by yourself. (See also: Creating the Menu)

6.2 Layout Options

Category Pages which display all posts to a specific category, tag, date or author (See also: Metas) are called "Archive Pages".

To change the page layout of your archive pages, head to Appearance → Customize → Layout and choose from the layout options within the Archive section.

Brooklyn supports four archive layouts: Standard, List, Grid and Masonry. For the List-, Grid- and Masonry-Layout you can also view the First Post as Standard Layout.
You can also enable the right sidebar or right shop sidebar or disable the sidebar from displaying on archive pages.

7.1 Creating the Blog Page

By default, your homepage will also display your post feed and listing all of your latest posts for your visitors. If you would like to have your homepage should be a static page instead and your post feed should be displayed on a separate page, please follow the following instructions:

1. Go to Wordpress admin panel and naviagte to Settings → Reading .
2. At the top of this screen, you'll see a section titled Front page displays . Click the little bubble next to the A static page option.
3. From the Front page drop-down menu, select your Home Page (static).
4. From the Post page drop-down menu, select your Blog Page.

The last step involves adding your Home Page and Blog to your navigation menu. (See also: Menu)

7.2 Layout Options

To change the Blog Page Layout, head to Appearance → Customize → Layout and choose the Blog Page section.

Brooklyn supports four blog page layouts: Standard, List, Grid and Masonry. For the List-, Grid- and Masonry-Layout you can also view the First Post as Standard Layout.
You can also enable the right sidebar or right shop sidebar or disable the sidebar from displaying on archive pages.

Additionally you will have the possibility to change the order of "Promo Boxes", "Popular Posts" and "Blog Posts" on the Blog Page. You only need to drag the Feature to your needed position. (See also: Promo Boxes, Popular Posts)

8.1 Creating the Menu

1. Go to Wordpress admin panel and navigate to Appearance → Menus
2. Select an existing Menu or create a new Menu
3. From the drop-downs on the left, choose the content to add to your menu.
4. Nest & position menu items by dragging & dropping them.
5. Be sure to check the box to set the menu as Primary for the Main Menu (header) or Footer for the Footer Menu.
6. Save menu

8.2 Adding Pages, Category Pages, Posts, Custom Links to your menu

On the left side of this screen are a number of drop-down boxes titled "Pages", "Categories", "Posts" and "Custom Links". Each heading will list available items you can add to your menu. The pages, categories and posts you've created will be listed below. Check the box next to the page, category or post you'd like to add to your menu and click Add to menu . The selected item should now appear under "Menu Structure" column. Here, you can drag and drop the item you've added to adjust its location in the menu. You can also create sub menus by dragging and dropping a menu item underneath another so that it's indented.

Note: The Footer doesn't support sub menus.

To add a custom link to your navigation menu for example that will direct users back to your homepage, select the "Link" drop-down menu. Enter your homepage URL into the appropriate box and then give it a title, such as "Home". Click Add to Menu and drag and drop the menu item to where you'd like it to be placed.

8.3 Additional Menu Item Features

For additional menu features, click on the Screen Options tab in the top-right corner of the Menu page. Here, you can add the option of linking directly to a Post or specific Tag within your navigation menu. You can also check the box next to Link Target to give yourself the option of having menu items open in an entirely new tab when clicked.

9.1 Navigation Bar

Navigation bar options are available in Wordpress Customizer.

1. Go to Wordpress admin panel and navigate to Appearance → Customize
2. Open the Tab Header → Navigation Bar

In this option panel you will have the possibilty to show or hide the Search form and the WooCommerce Cart. Also you can upload your own logo to the Navbar (this will be shown on Desktops and Tablets).

9.2 Logo

1. Go to Wordpress admin panel and navigate to Appearance → Customize
2. Open the Tab Header → Logo

In this panel option you are able to remove the logo and slogan in the header of your Wordpress Website. You can also upload and adjust your own logo, edit the slogan to your needs or activate the logo / slogan for dektop wiew.

Please note: Instead of the slogan you also can set a text logo. You can adjust the typography for that in the customizer under Typography & Colors → Headings → Slogan .

10.1 Logo & Copyright

At the bottom of the Wordpress theme is the footer area which features a text area to include copyright or disclaimer text. You are not required to include a copyright or disclaimer statement. In fact, you can type whatever you'd like in this area. You have also the possibility to change the logo with your own logo or to remove the default brooklyn logo.

1. To edit the footer logo and text area, go to Wordpress admin panel and navigate to Appearance → Customize
2. Open the Tab Footer → Logo & Copyright

10.2 Layout Options

Additionally you are able to change the order of the footer features "Instagram", "MailChimp Subscription Form" und "Logo, Copyright & Navbar". (See also: Instagram Muster, Mailchimp Subscribe Form)

1. To edit the footer logo and text area, go to Wordpress admin panel and navigate to Appearance → Customize
2. Open the Tab Footer → Order

16.1 How to create the Instagram Footer

The footer has an instagram area where you can add your Instagram account to display your Instagram images in a full-width section.

To add the Instagram Footer, navigate to WP Dashboard → Appearance → Customize → Instagram.

1. Optional: Add the Title / Link
2. Enter the username of your instagram account
3. Set up the max number of Instagram Posts you would to display on the footer (max. 12)

16.2 Add Instagram to sidebar

You can also add Instagram to the sidebar. (See also Adding Widgets to your sidebar)

17.1 How to create the MailChimp Footer

The footer has a also a Mailchimp Subscription area where you can add a MailChimp Subscription Form.
To add the MailChimp Subscribe Footer, go to Wordpress admin panel and navigate to Appearance → Customize → MailChimp Subscription Form .

1. Move the toggle Show on Footer to the right to activate the Mailchimp Subscription Form
2. Optional: Add the Title / Link
3. Enter the MaiChimp Post URL (the same URL will used for the sidebar widget)
4. Optional: Edit the Confirmation / Error Messages (will also used for the sidebar widget)

17.2 How to find the mailchimp post url?

1. Login to your mailchimp account
2. Go to your list
3. Select Signup Forms
4. Select Embedded forms
5. Copy the link and paste into action attribute.

18.1 Enabling / Disabling the sidebar

A sidebar is the vertical content area that displays on the right of your main content/post area. You are able to customize the sidebar and shop sidebar by filling up different widgets that display a variety of things.

To enable or disable the sidebar/shop sidebar on your Single Post Page or static Page, see also Pages - Layout Options.

You can also enable/disable the sidebar on your blog page and/or your archive pages (see also Blog Page - Layout Options, Category Pages - Layout Options)

18.2 Adding Widgets to your sidebar

To add, remove or edit your sidebar widgets please go to Wordpress admin panel and navigate to Appearance → Widgets . On the left, you will see a list of the available widgets to choose from [1]. On the right, you will see the widget area titled "Sidebar" and "Shop Sidebar" with activated widgets that are will be displayed on your website [2].
Simply drag & drop a widget on the left into the widget area to add a widget to your sidebar/shop sidebar.

18.3 Edit widgets in you sidebar

If you have dropped a widget into the sidebar/shop sidebar widget area please click on its heading and a drop-down menu will appear. Now you can make the adjustments you want to the widget's settings. You can also delete the widget from this widget setting drop-down.

You can also change the position of the widgets within the sidebar/shop sidebar. You only need drag and drop them above or below each other.

18.4 Brooklyn Theme Widgets

Facebook Like Box – Enables you to display the Facebook Like Box in your sidebar.

MailChimp Subscription Form – Displays the MailChimp Subscription Form.

Page Teaser – Creates a Page Teaser consisting of a title,subtitle, image, signature, description and link.

Popular Posts – Retrieves a list of the populuar posts filtered by views or likes.

Recent Posts – Retrieves a list of the most recent posts from all or a certain category or tag.

Social Media Links – Enables you to display the Social Media Icons in your sidebar.

Sponsored Post – Creates a Sponsored Post consisting of a title, image, description and link.

19.1 Typography & Colors

All typography & color settings can be found in Appearance → Customize → Typography & Colors .

19.2 Effects

To enable or disable the site-wide effects "Posts Lazy Load", "Sticky Navbar" and "Button Scroll Top" go to Wordpress admin panel and navigate to Appearance → Customize → Effects .

19.3 Favicon & Title

The site identity section in the customizer allows you to change the site title and description of your Wordpress theme. Here you also able to upload your personalized favicon. To make your setup please go to Wordpress admin panel and navigate to Appearance → Customize and click on the Site Identity tab.

20.1 Template Images

Brooklyn automatically resizes all uploaded images to the following image sizes:

• fullwidth-thumb: 1800px, scaled
• full-thumb: 1170px, scaled
• large-thumb: 600x400px, cropped
• small-thumb: 320x240px, cropped

20.2 Post Images

There are also default image sizes in Wordpress. To define these settings please navigate to Settings → Media :

• Thumbnail
• Medium
• Large

The default Wordpress image sizes are not used by the Brooklyn Blog template. Nevertheless your will be able to choose the default image sizes in the style editor if you want to add an image or a gallery.

Galleries and Images

With the style editor you will have the possibility to include galleries and images into your blog post.

To include galleries or images please do the following steps:

1. Click the position in the content textarea, where you want to include your gallery. (See also: Creating a Post, Creating a Page)
2. Click Add media which is located on the top of the toolbar.
3. Click to Create Gallery on the the left sidebar.
4. Now please choose the images you want to include into your new gallery.
5. When finished please click to Create new gallery on the right bottom corner on the right sidebar.
6. In the following window you can change the order of your added image easily via drag and drop.
7. Also you are able to adjust amount of used columns and the sizes of the images. Additionally you can setup to which target the images will be linked. Choose the link to the media file to enlarge the images via a lightbox.

If you only want to add an image into your blog post, please click to the image directly in the "Insert Media" window, do your image setup (same window) and insert the image.
The image should be enlarge in a lightbox when the visitor is clicking to the image? No problem. The only thing you need to do is that you make sure that you will provide an image caption text (you will find a caption field on the right of the media library).

22.1 Installation & Setup

If you're ready to begin setting up your webshop, you can install the WooCommerce plugin. (See also: Plugin Installation).

If you have installed WooCommerce not yet, WooCommerce will start the setup assistant automatically after installation. To save time we recommend to do the basic setup via the assistant.
If you skipped the wizard or want to re-install the WooCommerce pages, go to WooCommerce → Status → Tools and use the page installer tool Install WooCommerce pages.

WooCommerce Setup Wizard

Click to Let's go!

On the next page of the assistant you will get an explanation, that some pages will be created automatically (e.g.: Shop, Cart, Account, Checkout etc.) Click Continue to create these pages for WooCommerce.

On the next pages you can enter settings to shop location, shipping costs, taxes and payment methods. If you don't want to set up these settings now you can also skip this. You are able to change these settings also later in the settings of your WooCommerce plugin. Otherwise click continue.

On the last page you can create your first product optionally. Click to Create your first product.
You also can leave the assistant and add your products later.
For this please navigate to: WP Dashboard → Products → Add new.

22.2 Settings

You can edit global shop settings WP Dashboard → WooCommerce.
On the left side (of WooCommerce tab) you can edit your settings in the subordinated section Orders, Coupons, Reports, Settings etc.
Some section also contain a tab where settings can be made.

22.3 Creating a product

To create a new product please go to WP Dashboard → Products → Add new.
Similar to creating a post, you can enter a page title [1], add content [2], product categories [3], product tags [4] and assign a product image [5].
Additionally you can add further images by clicking "Add product gallery images" on the left bottom panel Product Gallery [6].

Use the tab Product data [7] on the left side to edit product information. Here you can enter settings for price, stock, inventory etc. You can enter also an additional short description on the field Product short description [8].

A detailed documentation for product settings you will find here: Setup WooCommerce Products

22.4 Sidebar & Widgets

The WooCommerce plugin also have customized widgets that you can add to your sidebar or the the additional shop sidebar of WooCommerce. Navigate to WP Dashboard → Appearance → Widgets.

On the left side all widgets are listed. WooCommerce widget are always recognizable by starting with the name "WooCommerce".
Simply drag & drop a widget on the left into the sidebar or shop sidebar.

To enable or disable the sidebar area on your shop and product pages, head to Appearance → Customize → Layout and choose the Shop section.
You can also enable or disable the sidebar or shop sidebar on the Shop and Single Product Page. To edit the sidebar for account, cart, wishlist and checkout, navigate to WP Dashboard → Pages.
Select the page and choose the option you want from the select field in the Layout Settings metabox and click Update.

22.5 Cart

To disable the card on the menu:

1. Navigate to WP Dashboard → Appearance → Customize
2. Open the Tab Header → Navigation Bar
3. Move the toggle Show Cart to the left
4. Click Save & Publish

22.6 Metas

You may hide certain Product Meta.

1. Go to Wordpress admin panel and navigate to Appearance → Customize
2. Open the Tab Layout → Post Meta

22.7 Quick View & Wishlist

The Brooklyn Wordpress theme will come with additional two shop extensions. To use these extensions you need to install and activate the plugins YITH WooCommerce Quick View and YITH WooCommerce Wishlist. (See also: Plugin Installation).

After installation and activation of the wishlist plugin an additional page will be created on WP Dashboard → Pages.

1. Quickview: On the shop page (product overview) you will get a zoom icon when you go over a product image (mouseover). With clicking to the zoom icon the product details will be shown in a popup.
2. Wishlist: On the shop page (product overview) you will get a heart icon when you go over a product image (mouseover). With clicking to the heart icon the product details will be add to the wishlist. On the product page you can add your product to wishlist with "Add to Wishlist".

Settings of the features "Quick view" and "Wishlist" can be edited in WP Dashboard → YITH Plugins → Quick View and WP Dashboard → YITH Plugins → Wishlist

22.8 Adding Shop Pages, Products, Product Categories and Product Tags to your menu

To show your shop on your Website you need to add the shop to your menu. Please navigate to WP Dashboard → Appearance → Menus. (See also: Menu)

With the installation and activation of WooCommerce new menu options, e.g. Products, Product categories Product tags and WooCommerce endpoints are available.
After executing the WooCommerce assistant you will also find additional pages ("Shop", "Cart", "Checkout" and "My Account"). After activation of the wishlist plugin you will also see the page "Wishlist".

Activate the checkboxes beside to the menu elements that you want to add to your menu. If you have done your selection please click to Add to menu. Via drag and drop you can arrange the menu to your needs or create submenus. If finished, please click Save menu to save your settings accordingly.