-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
218 lines (190 loc) · 14.9 KB
/
index.html
File metadata and controls
218 lines (190 loc) · 14.9 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Hanson - Multipurpose WordPress Theme Documentation</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="assets/css/flaticon.css">
<link rel="stylesheet" href="assets/css/style.css">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<header id="top" class="text-center pad40">
<div class="container">
<div class="row">
<div class="col-md-12">
<h1>HANSON - MULTIPURPOSE WORDPRESS THEME</h1>
<h4>Version 1.5 / Theme Documentation</h4>
</div>
</div>
</div>
</header>
<hr>
<section class="">
<div class="container">
<div class="row">
<!-- left menu start -->
<div class="col-md-3">
<div class="list-group">
<a href="#top" class="list-group-item active">THEME SETUP</a>
<a href="#section2" class="list-group-item ps">Overview</a>
<a href="#section3" class="list-group-item ps">Theme Installation</a>
<a href="#section6" class="list-group-item ps">Plugins Installation</a>
<a href="#section7" class="list-group-item ps">Import Sample Data</a>
<a href="#section8" class="list-group-item ps">Menu Setup</a>
<a href="#section9" class="list-group-item ps">Assign Home Page</a>
</div>
<div class="list-group">
<a href="#top" class="list-group-item active">THEME CUSTOMIZATION</a>
<a href="#section10" class="list-group-item ps">Change Logo</a>
<a href="#section11" class="list-group-item ps">Change Primary Color</a>
<a href="#section12" class="list-group-item ps">Copyright Text</a>
</div>
<div class="list-group">
<a href="#top" class="list-group-item active">HOW TO</a>
<a href="#section13" class="list-group-item ps">Create Project</a>
<a href="#section14" class="list-group-item ps">Add Project in page</a>
<a href="#section18" class="list-group-item ps">Add Testimonial in page</a>
<a href="#section19" class="list-group-item ps">Create Form</a>
<a href="#section20" class="list-group-item ps">Add Contact Form in Page</a>
<a href="#section21" class="list-group-item ps">Change Default Banner</a>
</div>
<div class="list-group">
<a href="#top" class="list-group-item active">RESOURCE</a>
</div>
</div>
<!-- left menu end -->
<!-- right content start -->
<div class="col-md-9">
<div id="section1" class="mb40">
<p>Thank you for purchasing Hudsonbiz WordPress Theme! In this document you will find the latest information on how to install, manage and update your theme, as well as create content, install plugins, import Demo data etc. If you like our theme and want to support us please rate it 5 star from your <a href="https://themeforest.net/downloads" target="_blank">Downloads Section</a></p>
</div>
<div id="section2" class="mb60">
<div class="well">
<p><strong class="orange">ITEM NAME:</strong> Hanson - Multipurpose WordPress Theme</p>
<p><strong class="orange">ITEM VERSION:</strong> 1.5</p>
<p><strong class="orange">MINIMUM REQUIRED:</strong> WordPress version 4.3.0</p>
<p><strong class="orange">AUTHOR:</strong> iThemesLab</p>
<strong class="orange">SUPPORT VIA EMAIL:</strong> ithemeslab[@]gmail.com
</div>
</div>
<div id="section3" class="mb60">
<h2 class="title">Theme Installation</h2> <a href="#top" class="to-top ps">#back to top</a><hr>
<p>Once you purchase Hanson from Themeforest, you can download the theme package. After you UnZIP the package you will find the theme file in it <strong>hanson.zip </strong>. There are 2 ways to install your theme, both are described step by step below.</p>
</div>
<div id="section4" class="mb60">
<h3 class="title">Installation via WordPress</h3> <a href="#top" class="to-top ps">#back to top</a><hr>
<p><strong class="orange">Step 1:</strong> Login to your WordPress Dashboard</p>
<p><strong class="orange">Step 2:</strong> Go to <strong>Appearance > Themes.</strong> Click the <strong>Add New</strong> button or <strong>Add new theme</strong> link.</p>
<p><strong class="orange">Step 3:</strong> Click on the <strong>Upload Theme</strong> button. Locate "hanson.zip" and click <strong>Install Now</strong></p>
<p><strong class="orange">Step 4:</strong> Click on the <strong>Activate</strong> button to activate Builder. Congratulations, you have now activated Builder! You can now proceed with Builder's <a href="#section5" class="ps">Plugin Installation.</a></p>
</div>
<div id="section5" class="mb60">
<h3 class="title">Installation via FTP</h3> <a href="#top" class="to-top ps">#back to top</a><hr>
<p><strong class="orange">Step 1:</strong> Log into your Hosting server using an FTP client (like FileZilla or WinSCP).</p>
<p><strong class="orange">Step 2:</strong> Locate "Hanson.zip" that you found in your ThemeForest Package and unzip it somewhere on your hard drive. Once it is unzipped it will look like a folder named <strong>Hanson</strong> with all theme files in it.</p>
<p><strong class="orange">Step 3:</strong> Locate your WordPress installation and upload the theme directory Hanson (you unzipped in the previous step) into ../wp-content/themes/ in your WordPress installation.</p>
<p><strong class="orange">Step 4:</strong> Click on the <strong>Activate</strong> button to activate Hudsonbiz from your back-end. Congratulations, you have now activated Hudsonbiz! You can now proceed with Hudsonbiz's <a href="#section5" class="ps">Plugin Installation.</a></p>
</div>
<div id="section6" class="mb60">
<h3 class="title">Plugin Installation</h3> <a href="#top" class="to-top ps">#back to top</a><hr>
<p>Once you activate the theme you will get a notice like (This theme requires the following plugins:) the screenshot below. Then click on <strong class="orange">Begin installing plugins</strong></p>
<p><img class="img-thumbnail" src="assets/images/plugin-install-notification.png" alt="install plugin"></p>
<p>Once you click <strong class="orange">Begin installing plugins</strong> you will redirect to <strong>Install Required Plugins</strong> page just like screenshot below.</p>
<p><img class="img-thumbnail" src="assets/images/installing-plugins.png" alt=""></p>
<p><strong class="orange">Step 1:</strong> Select All Plugins</p>
<p><strong class="orange">Step 2:</strong> Select <strong>Install</strong> from dropdown menu.</p>
<p><strong class="orange">Step 3:</strong> Click <strong>Apply</strong> and wait for a while.</p>
<p><strong class="orange">Step 4:</strong> After installed all the plugins please activate all the plugins one by one.</p>
</div>
<div id="section7" class="mb60">
<h3 class="title">Import Sample Data</h3> <a href="#top" class="to-top ps">#back to top</a><hr>
<h4 class="orange"><i class="fa fa-angle-right"></i> Theme Sample Data </h4>
<p>After activated all the plugins time to import sample data. Go to <strong>Tools > Import</strong> and install WordPress importer plugin.</p>
<p><img src="assets/images/wp-importer-plugin.png" alt="" class="img-thumbnail"></p>
<p>After install the plugin click on <strong>Run Importer</strong>.</p>
<p><img class="img-thumbnail" src="assets/images/run-importer.png" alt="install plugin"></p>
<p>Please locate the <strong class="green">Hudsonbiz.wordpress.sample.data.xml</strong> and click Upload file and import</p>
<p>Select a user and checked Download and import file attachments.</p>
<p>Click Submit and wait for a while.</p>
<h4 class="orange"><i class="fa fa-angle-right"></i> Slideshow Sample Data</h4>
<p>Click Slider Revolution from left side menu. Select <strong class="orange">Import Slider</strong> and locate <strong class="green">Hudsonbiz-slideshow-1.zip</strong> or <strong class="green">Hudsonbiz-slideshow-2.zip</strong> and click <strong class="purple">Import Slider</strong></p>
<p><img src="assets/images/import-slider.png" alt="" class="img-thumbnail"></p>
<h4 class="orange"><i class="fa fa-angle-right"></i> Widget Sample Data</h4>
<p>Go to <strong>Tools > Widget Settings Import</strong>. Locate <strong class="greeen">widget_data.json</strong> and click <strong>Show Widget Settings</strong>. Do as you can see in the screenshot below.</p>
<p><img src="assets/images/widget-import.png" alt="" class="img-thumbnail"></p>
<div id="section8" class="mb60">
<h3 class="title">Menu Setup</h3> <a href="#top" class="to-top ps">#back to top</a><hr>
<p>If sample data imported then go to <strong>Appearence > Menus</strong> and find <strong class="orange">Primary Menu</strong> from upper left dropdown list. Then assign the menu in <strong class="orange">Primary</strong> display menu location.</p>
<p><img class="img-thumbnail" src="assets/images/primary-menu.png" alt="primary menu"></p>
<p><img class="img-thumbnail" src="assets/images/menu-location.png" alt="menu location"></p>
<div id="section9" class="mb60">
<h3 class="title">Assign Home Page</h3> <a href="#top" class="to-top ps">#back to top</a><hr>
<p>Go to <strong>Settings > Reading</strong>. Change the settings as like screenshot below.</p>
<p><img class="img-thumbnail" src="assets/images/assign-homepage.png" alt="assign homepage"></p>
<div id="section10" class="mb60">
<h3 class="title">Change Logo</h3> <a href="#top" class="to-top ps">#back to top</a><hr>
<p>Go to <strong>Appearence > Customize</strong>. On the customize panel go to <strong>Header Settings > Custom Logo</strong> and change the logo from options.</p>
<p><img class="img-thumbnail" src="assets/images/change-logo.png" alt="change logo"></p>
<div id="section11" class="mb60">
<h3 class="title">Change Primary Color</h3> <a href="#top" class="to-top ps">#back to top</a><hr>
<p>Go to <strong>Appearence > Customize</strong>. On the customize panel go to <strong>General Settings > Colors</strong> and change the primary color from options.</p>
<p><img class="img-thumbnail" src="assets/images/primary-color.png" alt="primary color"></p>
<div id="section12" class="mb60">
<h3 class="title">Copyright Text</h3> <a href="#top" class="to-top ps">#back to top</a><hr>
<p>Go to <strong>Appearence > Customize</strong>. On the customize panel go to <strong>Footer Settings > Copyright</strong> and change the copyright text from options.</p>
<p><img class="img-thumbnail" src="assets/images/copyright-text.png" alt="copyright text"></p>
<div id="section13" class="mb60">
<h3 class="title">Create Project</h3> <a href="#top" class="to-top ps">#back to top</a><hr>
<p><strong><span class="orange">Step 1:</span></strong> At first go to <strong>Projects > Project Type</strong> and Create new <strong class="green">Project Type</strong></p>
<p><img class="img-thumbnail" src="assets/images/create-project-type.png" alt=""/></p>
<p><strong><span class="orange">Step 2:</span></strong> Go to <strong>Projects > Add New</strong> and insert the <span class="label label-info">Title</span> <span class="label label-info">Text</span> <span class="label label-info">Featured Image</span> <span class="label label-info">Project Types</span> as per screenshot below.</p>
<p><img class="img-thumbnail" src="assets/images/create-project.png" alt=""/></p>
</div>
<div id="section14" class="mb60">
<h3 class="title">Add Projects in page</h3> <a href="#top" class="to-top ps">#back to top</a><hr>
<p>Create New Page. Select <strong class="orange">ITL - Portfolio</strong> addon from left sidebar, drag it into the page and change the settings like below.</p>
<p><img class="img-thumbnail" src="assets/images/itl-portfolio.png" alt=""/></p>
</div>
<div id="section17" class="mb60">
<h3 class="title">Create Testimonial</h3> <a href="#top" class="to-top ps">#back to top</a><hr>
<p>Now its really easy to make testimonial section. Select <strong>ITL - Testimonial</strong> from left sidebar, drag it into the page and change the settings.</p>
<p><img class="img-thumbnail" src="assets/images/itl-testimonial.png" alt=""/></p>
</div>
<div id="section19" class="mb60">
<h3 class="title">Create Contact Form</h3> <a href="#top" class="to-top ps">#back to top</a><hr>
<p>Go to <strong>Contact > Add New</strong> and insert the <span class="label label-info">Contact Form Name</span>. In Form tab you need to put some short code to get the form. <a href="https://gist.github.com/asifpix/b971ed3e08f91a4e7b1adeab410e3537" target="_blank">Click here</a> to get the contact form shortcode. Just copy that code and paste it in Form tab.</p>
<p><img class="img-thumbnail" src="assets/images/create-ctc-form.png" alt=""/></p>
</div>
<div id="section20" class="mb60">
<h3 class="title">Add Contact Form in page</h3> <a href="#top" class="to-top ps">#back to top</a><hr>
<p>Select <strong class="orange">ITL - Contact Form 7</strong> addon, drag it into the page and select the contact form you want to use.</p>
<p><img class="img-thumbnail" src="assets/images/itl-ctc-form.png" alt=""/></p>
</div>
<div id="section21" class="mb60">
<h3 class="title">Change default banner</h3> <a href="#top" class="to-top ps">#back to top</a><hr>
<p>Go to <strong class="orange">Appearance > Customize > Header Settings > Default Banner</strong> and change the banner image from here.</p>
<p><img class="img-thumbnail" src="assets/images/change-default-banner.png" alt=""/></p>
<div class="alert alert-info" role="alert"><strong>Note:</strong> If you change the banner image from page then this settings will override.</div>
</div>
</div>
</div>
</div>
<!-- right content end -->
</div>
</div>
</section>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>