- Category: How to use Wordpress
- Published: 20 May 2014
- Hits: 2283
In Article 9.1, you've got that how to add new, install themes, manage installed themes in your Wordpress website. You've chosen a relevant theme that corresponds with your website content. Now, we're going to view details about the Customize function.
You choose Appearance > Customize. With the Worpress support themes, the customize method may be very different with themes that you download from other website.
I'll get an example of customizing Twenty Thirteen theme (Wordpress support theme) and an example of customizing one of best free Wordpress themes Metro Blog - SM Themes.com
1. Twenty Thirteen theme - Wordpress support theme
You choose Twenty Thirteen to the main theme for your website. Click Customize button to start customizing Twenty Thirteen theme.
Site Title & Tagline:
- Enter your site title and tagline, mark Display Header Text checkbox to display site title and tagline in the text type. If you don't mark, the header doesn't display site title, tagline.
- Change color of Site title, Tagline
- Choose the background of the header
- Choose menus that will be used for the theme. In the picture below, you know the theme supports 1 menu and you can choose a menu in the Navigation Menu list below. I'll say about how to create menus in the next posts.
Static Front Page:
- Your latest posts: homepage displays latest posts
-A static page:
The homepage will display the latest posts from the newest posts to older posts in default.. However, if you choose A static page item, you will choose a page to your homepage (In picture above, the front page is About us and About us page will be your homepage, the posts list on the homepage will be changed to Posts page (Tourism page).
2. You download one of best free Wordpress themes Metro Blog from SMThemes.com or another website that support free and premium themes
- In Article 9.1, you've knownArticle 9.1. I'll say it again once more.
- You go to the website: http://smthemes.com/download/metroblog/ to download Metro Blog package theme (after downloaded, you've got metroblog.zip file in your computer)
- Login the Wordpress administrator page, choose Appearance > Themes > Add New
- Change with Upload tab> click Choose File button > Show path of metroblog.zip file > Enter Install Now to start installing Metro Blog package theme
- After you have successfully installed Metro Blog theme, click Activate to use Metro Blog theme for your website.
- In the picture below, it has Metro Blog item that has not in the picture above. You click Metro Blog item to configure Metro Blog theme.
Metro Blog configuration includes:
- General option
- Logo Source:
- Logo Image: choose an image to the logo
- Logo Text: choose a text to logos
- Front Page Title: enter the title bar content of the homepage
Ex. Your type of a Front Page Title item with content is "vandon.com.vn - Wordpress Tutorial". When you view homepage, you'll see the content in the title bar:
- Site Title: enter the title bar content of page
Default in Site Title is "%s", it means you choose a page title to your title bar content on the browser.
- Favicon: choose Upload > choose another logo to replace icon on the title bar
You save all changes by click in the right window.
- You have some featured contents. The slider will help you give the featured content to the visitors very quickly:
- However, as you see, SMThemes created content of the slides. You need to change image, change content to correspond to your website.
- In the picture above, in the Slide Source item, you choose :
- Custom slides - use images below to the slider.
- Click images below to edit images and contents of the slider (example: you clicked image #2 to edit slide #2)
- Image URL: URL of image
- Link URL: when viewers click an image or introtext in the slide #2, they'll go to link URL to view detail information of the slide #2.
- Title: title of the slide.
- Content: display an introtext of posts on the slide #2.
Category: add categories to the slider.
- Number of slides: show quantity of slides that displayed in the slider.
- Category: choose categories that displayed in the slider. All categories are chosen by default.
- Order by: display by order, Created is chosen by default, it means you order slides by created date.
Posts: choose posts to the slider
Pages: choose pages to the slide
- And some options in the slider as: Show slide thumbnail, Show text, Show links, ....
- Configure the regional arrangements on your site.
- In the picture above, you choose 1 - only display website content on your website, 2- the left main area display content of the website và the sidebar is right, 3- there are a left sidebar and the main area display content of the website, 4- content of the website displays at between, there are a left sidebar and a right sidebar.
- Load post dynamically
- Show related posts? ON - display related posts.
- Related posts count: count quantity of posts
4. Social Button
- On the left website, you see social network icons as: Facebook like, Twitter tweet and Google +1 to share your website with everybody by their social accounts.
- To add new, edit social share buttons, you click Social Button in the left menu, turn Show social box ON.
- In this picture, you're choosing Facebook like, Twitter, Google+. You can add new or remove social network icons by mark/ unmark checkboxes, choose Add Button.
- Site description: enters descriptions of your site
- Site keywords: enter keywords of your site
- Site Author Meta: information about you
- Configure way that displays menus
- Language that used in Metro Blog Theme is English in default. If your language is not English, you need to translate it to your language in Translations item.
8. Contact Form
- Create contact sample
- How to use the contact form?
- First, you need to create a new page (choose Pages > Add New) with page title is Contact Us.
- Choose Contact Form in Template list > Enter Publish to create "Contact Us" page.
- Add the "Contact Us" page to Menus on your website (I'll say about how to create a menu in next post).
- When you click "Contact Us" item on your site, you'll see your contact information:
This contact form contains 3 parts:
- Part 1: display your position on Google Maps.
- Part 2: display your information: Address, phone, email, Skype account.
- Part 3: visitors send you a message at this part. Informations is marked (*), it means the visitors must fill full required information, then click Send to send you a message.
- You can edit "Contact Us" information that correspond with you by:
In Metro Blog, choose Contact Form:
Text: enter title of contact.
Map Address: enter your address. Google Maps use this address to display your position on the map.
- Click icon to edit each row of correspond information
- Click icons to delete rows of correspond information
- Upload: replace default icons by image that you will upload
- Preset: Choose one of these icons for that information.
- Add detail: add new row in the contact information
- Save detail: if you edit the information, you click Save to save changes. If you add new detail, you click Save to save the new detail.
Contact form: use the contact form to send a message to you from vỉewers.
- Text field: enter a text field
- Text area: enter a text paragraph
- Required: choose required full information before they can send to you by a mark Required checkbox that correspond that information.
- Add input: add new required information that you need the visitors fill full
- Email for messages: is the email address that receives messages from the visitors.
- Detail information about SMThemes - Metro Blog Author
10. Fresh themes
- Introduce other themes in SMThemes's library. You can download and install it to your website.
11. Theme Activation
- You're using Metro Blog free version. You need to pay to SMTheme to use more functions and you will be supported from them.
- How to register and use Gravatar on WordPress
- How to create and manage categories and tags in WordPress
- How to display empty categories in WordPress
- Article 9.2: Guide to customize your main theme using Customize function
- Article 9.1 - Change your theme using Appearance Tool
- Article 8: How to create and manage page using Page tool
- Article 7: Manage media file using media tool in Wordpress
- Article 6.2.2: Detail about publishing post by Add New function of Posts tools
- Article 6.2.1: Detail about publishing post by Add New function of Posts tools
- Article 6.1: Manage, edit/delete articles with All Posts function in Posts tool
- Article 5: Using Dashboard tool in the administrator page
- Article 4: Using 17 tools in the administrator page