BT MEDIA JOOMLA COMPONENT

Transcription

1 BT MEDIA JOOMLA COMPONENT User guide Version 1.0 Copyright 2013Bowthemes Inc.

2 1 Table of Contents Introduction...3 Related Topics:...3 Product Features...3 Installing and Upgrading...4 System Requirement...4 Downloading...4 Manual Installation...4 Module Upgrading...5 Uninstalling...6 Setting...7 General options...8 Show options...9 Image options...13 Fancy box options...16 BT Media Administrator...18 Category Management...18 Media Management...28 Tag Manager...41 BT Media Modules...50 BT Media Categories Module...50 BT Media Gallery Module...51 BT Media Tags Module...54 BT Media Plug-ins...56 BT Media Xmap Plug-in...56 BT Media Search Plug-in and BT Media Finder Plug-in...56

3 2 BT Media Gallery Plug-in...56 Common Error Using Product...57 Problem with Flash Uploader...57 Conflict with sh404 Component...57 Uninstall by limitation of file size...58 Problem with image processing...58 Contacting Bowthemes...60

4 3 Introduction BT Media is full-featured multimedia component for Joomla. This extension connects easily with your YouTube, Vimeo, Flickr and Picasa account to get video and images files by some clicks. It's hard to resist its beautiful Fancy box style (currently use for Facebook) and its friendly User engagement system (ratings, comments, social media sharing). Let's display your digital gallery like a PRO! Related Topics: Details View Demo Forum Product Features Media Management Flexibility: BT Media component allows you create multi level of Categories. Various media source: get images and videos from your computer folder and media content hosting (Flickr, Picasa, YouTube and Vimeo). Smart Tag Manager: Automatically get tags while embedding YouTube and Vimeo files. Uploading features: Supports upload by Flash and HTML 5. Useful supported extensions: add-media-to-article plug-in, Xmap, Smart Search... Multiple image processing method. Flexible Layout Multi-layout: Excellent interface with 03 layouts and various parameters to configure. It s easy to add or modify custom layout. Responsive Design: Support Full Responsive template Voting and Commenting System Allows user for rating, commenting as well as social sharing.. Highly Optimization Powerful plug-ins: Search Plug-in is included. Article Plug-in allows users to insert projects into articles is included Friendly interface: SEF and breadcrumbs are supported; Cross-browser support Compatible with Joomla 3.x, Joomla 2.5 or above; and almost all web browsers: IE7+, Firefox 10+, Safari 3+, Chrome 8+, Opera 9+

5 4 Installing and Upgrading System Requirement Server requirements PHP 5.0 or above with GD library is enabled. Please follow thislinkto check it MySQL 5.0 or above Joomla 2.5.x or above; Client requirements Firefox 3.5.x, Internet Explorer 7or above... Downloading BT Media Component is a commercial extension. Become our membership is required to download the product. Register here. For Bowthemes member, please download the component at BT Media detail page. You have 7 days to decide use the product or not. If the product can t makes you satisfied in these days, your money will be refund. Click here to send refund request. Manual Installation Please follow these steps to install the product: Step 1: Go to Extension Manager Step 2: Browse the installation package Step 3: Click Upload & Install

6 5 Illustrated image of successful installation: Module Upgrading Upgrading of this extension to newest version can be easily done by following again installation steps above. But we recommend you to back up your changes of source code and language files in this module before starting any upgrades.

7 6 Uninstalling For uninstalling the product, please follow these steps: Step 1: Go to Extension Manager Step 2: Click to Manage menu link Step 3: Input component name in search textbox. Step 4: Mark checkbox of the module Step 5: Click Uninstall button

8 7 Setting Go to Joomla administration. Select Components from Main menu > BT Media to start. Hit Option button and you will be delivered to configuration area of BT Media component. There are 4 main sessions: General option: Contains general configuration of the component Show options: Contains parameters that adjust the way one or multiple media items displayed on Joomla site. Image options: Contains parameters that adjust image processing before uploading image as well as before displaying them on the browser Fancy box options: Contains parameters about effect changing of fancy box library

9 8 General options Field name Description Default value Folder for saving files Set folder contains media item images/bt_media Admin upload type uploaded from computer or gotten from other sources Select the way image or video will be uploaded to Joomla site Flash upload

10 9 Enable voting On/Off voting system Yes Allow guest votes Allows/ Disallows guest leave a vote No Enable comment On /Off commenting system Yes Enable sharing On/Off social share system Yes Note: To turn on sharing and commenting system, BT Social Share plug-in must be installed and activated Show options Show options for displaying media item on page

11 10

12 11 Field name Description Default value Theme Option Select theme Media options Display filter bar Media item's displaying width Media item's displaying height Display sub items Display title Display item description Choose Theme to display media items on website On/Off search bar and media filter on website Set width of media item while displaying on fancybox Set height of media item while displaying on fancybox Display/ Not display media items in sub-category Display/ Not display media item s title Display/ Not display media item s description default Yes No Yes Yes Display category Display/ Not display name of Yes category that contains media items Display created by Display/ Not display media author s Yes Show hits Show tags name Display/ Not display number of times media item loaded Display/ Not display media item s tag Yes Yes

13 12 Limit item Set the number of items displayed in each page 20 Order by Set displaying order of media items Default - ordering Type of order Category options Select whether media items are arranged by ascending or descending order ASC Display category information Display/ Not display category s Yes information Display name Display/ Not display category s Yes name Display description Display/ Not display category s Yes description Display created by Display/ Not display category s No Display hits information Display/ Not display number of times that category is displayed No Display parent Display/ Not display parent Yes Expand child category as an item on Joomla page Display/ Not display child category as an item on Joomla page Yes Order by Set the order following which Default - ordering categories are displayed and arranged Type of order Select whether categories are ASC arranged by ascending or

14 13 descending order Image options This configuration will be apply for all images when file is uploaded

15 14 Field name Description Default value Flickr API Large image process Thumbnail image process Crop position Insert Flickr API key, you need it to use api functions provided by Flickr. If you don t have it yet, please go to this pageto create one Choose the way to treat with large image Choose the way to generate a thumbnail image Choose position of image to crop. This parameter only appears when you select crop as image processing method Empty Crop Crop Center JPEG Quality Set quality of JPEG image after 100 processing Image width Set image width of large image 700 Image height Set image height of large image 450 Thumb width Set image width of thumbnail 200 Thumb height Set image height of thumbnail 130 Watermark System Watermark system On/Off watermark features No WM in categories Select categories on which All watermark will be applied WM thumbnail Allows/Disallows watermark Yes applied on thumbnail

16 15 WM type WM text Select watermark type: image or text Add text string that will be used as watermark image bowthemes.com WM image Image will be used as watermark Empty WM font Select font for Watermark text Tahoma WM font color Select font color for Watermark text FFFFFF (White) WM font size Set font size for Watermark text 11 WM background On/Off Watermark Background Yes WM background color Set color for Watermark (Black) WM Position Background Set position that applied watermark on image Bottom Right WM padding Set the distance between 4 watermark and nearest border of the image WM Opacity Set watermark opacity 70 WM Rotate Set rotation angleof watermark. 0

17 16 Fancy box options Field name Description Default Value Open effect Choose effect while opening fancy box None Close effect Choose effect while closing fancy box None Next/Previous item effect Choose effect while transiting to Next None Aspect Ratio Previous item Choose whether remaining aspect ratio of image or not Yes

18 17 Auto play Choose whether auto-starting No Play speed Slideshow while opening fancy box or not Set speed of transition between items (when Auto-play mode is set) 3 Padding Set Padding for fancy box s content 15 Margin Set Margin for fancy box s content 20 Close button Display/Not display close button of fancy box Yes

19 18 BT Media Administrator Category Management Follow this path: Main menu -> Components ->BT Media -> Categories. Of if you are already in Bt Media component manager, you can choose category menu from menu list provided by BT Media Component. Add new category In category manager area, click New button. You will be delivered to add-new category area.

20 19 Fill in necessary information data fields There are 3 tabs in this section - Category: All information about category (requires full-information) - Option: Select options to configure category displaying (You may don t have to insert data. Information will be gotten from component configuration. - Metadata: Metadata information Let s go to the detail:

21 20 Category tab

22 21 Field name Description Default value ID ID of category (will be 0 Name Alias Parent Created date Language Access automatically added by system, you cannot add or change value of this field) Insert Category name (this is required field) Insert category Alias (If you add nothing in this field, system will automatically create alias for the category in above fieldbased on its name Set parent category of this new category. If this field set to None, added category will become source category Date adding this category. If you leave it Empty, the system will automatically add current date and time on this field Set language in which category is allowed to display Set access authority (which user group can view this category) Empty Empty None Empty All Public Status Set category status Published Category Image Select category avatar Empty

23 22 Created by Add category author s name Current user Description Add category description Empty Option tab Field name Description Default Value Display category information Display name Display description Display/ Not display category information Display/ Not display category name Display/ Not display category description Use Global Use Global Use Global Display created by Display/ Not display category Use Global

24 23 Display hits author s name Display/ Not display category s number of displays Use Global Display parent Display/ Not display parent Use Global category as an item on Joomla page Expand child Display/ Not display child Use Global category as an item on Joomla page Metadata tab

25 24 Field name Description Default value Meta title Title of category s details page. Empty Meta Keywords Meta Description Robots Value of HTML Keywords Meta Tag. Each word is separated by a comma. Frequently used for SEO Enter a paragraph that will be value of HTML Description Meta Tag. Used for SEO Choose value of HTML Robot Tag. All of options are: - Use Global - Index, Follow - No Index, Follow - Index, No Follow No Index, No Follow Empty Empty Use Global When all of these fields are filled, there are 3 options to complete Add new category o Save: Save category information and go to edit page of this category o Save & Close: Save category then go to category manager page o Save & New: Save category then reset all fields to default for creating new category You can select Cancel to deny all above processes. Edit Category There are two ways to edit a category o Mark checkbox beside the name of category that you want to edit then click edit

26 25 o Click directly onto category name On the edit page of category, you can edit, change or insert new data to the category. After finishing, you can choose from Save the change or deny it by clicking Close button.

27 26

28 27 Delete category Delete a category is a 2-step process o Send category to trash Check category name that you want to delete then click Trash button o Delete category In category filter box, select Trashed, check category names that you want to delete then click Empty trash to delete selected categories. Note: You can only delete empty category (don t contains any media item). If a category contains media item, you need to delete all media items or move them to another category.

29 28 Media Management Follow this path to Media Manager: Main menu -> Components ->Bt Media -> Media. Or if you are already in BT Media component area, you can click Media menu from menu list provided by BT Media Component. Insert new Media You have two ways to do it: Add single media or add multiple media at the same time.

30 29 o Add single media In Media management page, click New button. You will be delivered to Add-new media item page Fill in all necessary information on data fields:

31 30 This section comes with 3 tabs: - Media information: Media information (you may need to fill in completed information) - Option: Select display options for category (You may not have to insert data as information will automatically be gotten from component configuration). - Metadata: Metadata information Media information tab

32 31 Field name Description Default Value ID Name Alias Media ID (will be automatically added by system, you cannot add or change value of this field) Insert Media item name (this is required field) Insert media item Alias (If you add nothing in this field, system will automatically create alias for the media item in above field, based on its name 0 Empty Empty Category Select category that contains Select Category Language Access media item (this is required field) Set language in which media item is allowed to display Set access authority (which user group can view this item) All Public Created date Date adding this media item Empty Status Set media item status Published Created by Add category author s name Current user Featured Tags Source of Media Choose whether this is featured item or not Add a tag list for media item. Each tag is separated by a comma (,) Set media source (forvideo item gotten from YouTube or Vimeo) No Empty Media value

33 32 Video URL Insert URL of gotten video (for video item gotten from YouTube or Vimeo). You can change when you need update this item to new video Media value Description Add media item description Empty Option tab Field name Description Default Value Display title Display item description Display/ Not display media item name Display/ Not display media item description Use Global Use Global

34 33 Display created by Display/ Not display media item creator s name Use Global Display hits Display/ Not display media Use Global Display category Show tags item s number of displays Display/ Not display name of category that contains this item Display/ Not display tags of media item Use Global Use Global Metadata tab

35 34 Field name Description Default value Meta title Title of media s details page. Empty Meta Keywords Meta Description Robots Value of HTML Keywords Meta Tag. Each word is separated by a comma. Frequently used for SEO Enter a paragraph that will be value of HTML Description Meta Tag. Used for SEO Choose value of HTML Robot Tag. All of options are: - Use Global - Index, Follow - No Index, Follow - Index, No Follow No Index, No Follow Empty Empty Use Global When all of these fields are filled, there are 2 options to complete Add new media item - Save: Save media information and go to edit page of this item - Save & Close: Save media item then go to media manager page You can select Cancel to deny all above processes. o Add multiple media item at the same time In media manager area, click onto the button Multiple Add. You will be delivered to the area that allows you to add a mass of media items.

36 35 At this page, you can add images or videos from various sources: - Images: You can upload them from Computer folder or media folder of Joomla, as well as get them from Flickr or Picasa Upload from local Click on Upload from local to select files you need. Multiple-file selection is allowed. The uploading process will take place automatically when you finish the selection.

37 36 Upload from Folder Click to select folders you want. If the folder is selected, you can click again to deselect Put a mark at the checkbox beside text strings get file from sub folder if you want to get images from sub-folder of selected folder See the Load Image button below, click on it to get items

38 37 Get from Flickr Insert Flickr user name, wait for Ajax to load the albums. Select albums you want then wait again for Ajax to load album information. You can select getting images from X to Y follow image order on albums, afterwards, click on Get Images button. Note: You need to provide Flickr Api in BT Media Configuration. Get from Picasa You can get images from Picasa in the same way you do with Flickr, but it doesn t require API to start. - Video Upload file from local

39 38 The process is similar to image uploading. The allowed file types are: FLV, MP4. Upload from folder Again, the process is similar to image uploading Get file from YouTube Select the way you get YouTube video: from account/playlist url (1) or from video url (2). (1): You need to insert an existing YouTube account, let Ajax download video and playlist information so that you can get the videos (2): you need to insert an available YouTube URL, let Ajax download needed information so that you can get the videos Get file from Vimeo The process is similar to getting video from YouTube Edit a media item There are 2 ways to edit a media item o Mark checkbox beside the name of media item that you want to edit then click edit

40 39 o Click directly onto media item s name On the edit page of media item, you can edit, change or insert new data to the item. After finishing, you can choose from Save the change or deny it by clicking Close button.

41 40 Deletemedia item Delete a category is a 2-step process o Send media item to trash Check item name that you want to delete then click Trash button o Delete item

42 41 In item filter box, select Trashed, check item names that you want to delete then click Empty trash to delete selected items. Tag Manager Following this path:: Main menu -> Components -> BT media ->Tags. Of if you are already in Bt Media component manager, you can choose Tag menu from menu list provided by BT Media Component.

43 42 Add new tag There are 2 ways to add tags: Add single tag in general way and add multiple tags in smart way when adding a media item. o Add single tag In Tag manager area, click New button. You will be delivered to add-new tag area. Fill in necessary information data fields There are 2 tabs in this section - Tag information: All information about tag (requires completed information) - Metadata: Metadata information Let s go to the detail: Tag Information tab

44 43 Field name Description Default value ID ID of tag (will be automatically added by system, you cannot add 0

45 44 Name Alias Created date Language Access or change value of this field) Insert tag name (this is required field) Insert tag Alias (If you add nothing in this field, system will automatically create alias for the category in above field based on its name Date adding this tag. If you leave it Empty, the system will automatically add current date and time on this field Set language in which this tag is allowed to display Set access authority (which user group can view this tag) Empty Empty Empty All Publish Status Set tag status Published Created by Add tag author s name Current user Description Add tag description Empty

46 45 Metadata tab Field name Description Default value Meta title Title of tag s details page. Empty Meta Keywords Meta Description Robots Value of HTML Keywords Meta Tag. Each word is separated by a comma. Frequently used for SEO Enter a paragraph that will be value of HTML Description Meta Tag. Used for SEO Choose value of HTML Robot Tag. All of options are: - Use Global Empty Empty Use Global

47 46 - Index, Follow - No Index, Follow - Index, No Follow No Index, No Follow When all of these fields are filled, there are 3 options to complete Add new tag o Save: Save tag information and go to edit page of this tag o Save & Close: Save tag then go to Tag manager page o Save & New: Save tag then reset all fields to default for creating new tag You can select Cancel to deny all above processes. o Add multiple tags at the same time or edit a media item While adding a single media item, in Tag field, you can add one or multiple tag. Each tag will be separated by a comma (,). If this tag is already exist, the system will automatically add tag to media item. If not, the system will automatically create new tag then add tag to media item. Edit tag There are two ways to edit a tag o Mark checkbox beside the name of tag that you want to edit then click edit

48 47 o Click directly onto category name On the edit page of tag, you can edit, change or insert new data to the tag. After finishing, you can choose from Save the change or deny it by clicking Close button.

49 48 Delete tag Delete a tag is a 2-step process o Send tag to trash Check tag name that you want to delete then click Trash button

50 49 o Deletetag - In tag filter box, select Trashed, check tag names that you want to delete then click Empty trash to delete selected tags.

51 50 BT Media Modules BT Media Categories Module This module allows you to display all categories or sub-categories of a category. You can adjust the display of all sub-categories or only sub-categories from selected categories, along with media items in each category. - BT Media Categories configuration Follow this path: Main menu -> Extensions -> Module Manager -> BT Media Gallery.

52 51 - Options of Module Configuration Field name Description Default Value Select category Sourced category that contains displayed sub-categories Root Yes Display item count Show sub category Display? Not display subcategories Display/ Not display number of media item in each category No BT Media Gallery Module This module allows you to display, as gallery, some media items from categories set on Module configuration. - BT Media Gallery module configuration Follow this path: Main menu -> Extensions -> Module Manager -> BT Media Gallery.

53 52

54 53 - Options of Module Configuration Field name Description Default Value Select category Display limit item Select category from which item will be gotten and displayed Set number of media item gotten to display on module Select All 10 Items type Set media item type All Items sort Featured items Set the order following which media items aregotten, displayed and arranged Select whether only get featured media items or not Ordering No

55 54 BT Media Tags Module This module allows you to display tags in a list with options - BT Media Tags Module configuration. Follow this path: Main menu -> Extensions -> Module Manager -> BT Media Tags.

56 55 - Options for Module Configuration Field name Description Default Value Number Tags Set the number of tag displayed 20 Sort By Select the way you want to Ordering Display item count arrange tags Display/Not display number of media item displayed in each tag No

57 56 BT Media Plug-ins BT Media Xmap Plug-in This is plug-in that helps Xmap component to create and index contents of BT Media Component. You need Xmap component installed in order to run this plug-in. BT Media Search Plug-in and BT Media Finder Plug-in This is two plug-ins that help website to index contents of BT Media Component therefore allow user to search content of website inside BT Media Component. BT Media Gallery Plug-in This is a set of two plug-ins BT Media Button and BT Media Display. - BT Media Button plug-in: provide a button that allows user to insert media item in article content (during editing process) - BT Media Display plug-in: helps display selected media items through BT Media button plug-in under gallery-style. By the default, when BT Media Gallery package is installed, this plug-in is enabled already.

58 57 Common Error Using Product Problem with Flash Uploader At present, some web browsers don t support Flash or they re having problem with it, so you can t upload images to Media s gallery. Please use Simple Uploader instead. It s just original File input of HTML. Conflict with sh404 Component If you are using sh404 for SEO on your site, your website may come across an error (Not Found 404 or Internal Server Error 500). In this case please open sh404 component, find BT Media in By component tabs, then choose Use Joomla Route for the component like in the image below:

59 58 Uninstall by limitation of file size Installation package of this component takes 2MB, not too large, but the problem here isthat some hosting services only allow customers to upload file with capacity less than 2MB. To solve it, you should contact with your hosting provider to increase upload max size. You can see this information in Site > Site Information > PHP information tab Problem with image processing If you use BT Media in a long time, many images were created.in case that you try to change its size in control panel, thatmight cause the server to be overloaded because it can t process all images at the same times. Thus, after setting a new dimension of the images, please save change and click Rebuild Image in Medias Manager to resize images one by one. Afterward, the web browser will direct to the page that show you progress of image processing.

60 59 After successful image rebuilding, browser will redirect to previous page with a notice like illustrated image:

61 60 Contacting Bowthemes All Bowthemes products include forum support, support and ticket support. Please refer your membership package to select the compatible kind of support, as we may be able to solve the problem without delay. Website: Forum support: support: Ticket support: If you encounter any issues with Bowthemes extensions and templates, us at we will be happy to answer your questions. This document is proprietary and confidential. No part of this document may be disclosed in any manner to a third party without the prior written consent of Bowthemes Team.