Malistena

Child Theme

A child theme is a theme that inherits the functionality and styling of another theme, called the parent theme. Child themes are the recommended way of modifying an existing theme.

Why use a Child Theme?

There are a few reasons why you would want to use a child theme:

• If you modify a theme directly and it is updated, then your modifications may be lost. By using a child theme you will ensure that your modifications are preserved.
• Using a child theme can speed up development time.
• Using a child theme is a great way to learn about WordPress theme development.

Child Theme Install

1. Log in to the WordPress Administration Panels.
2. Navigate to the Appearance > Themes menu.
3. Click the Add New button on the top of the screen.
4. On the next page, click the Upload Theme button on the top of the screen.
5. Click the Choose File button to open up a dialog to browse your computer and navigate to Child Theme folder. Select the file malistena-child.zip and click Install Now.
6. Please wait a few seconds, WordPress will upload and extract the theme archive for you. All you need to do next is to press the Activate link under the message for successful theme installation.
7. That's it! Now you can add custom CSS code and PHP functions.

How to use the child theme

1. After install the child theme navigate to Wordpress admin panel.
2. Navigate to the Appearance > Editor menu.
3. In the section titled Templates, you will see a list of files that you can edit:
• functions.php - This lets you add additional functions, classes and hooks to WordPress theme without needing to alter the code within the functions file of the parent theme.
• style.css - This lets you add or change the theme styles (colors, sizes, fonts, backgrounds etc.) without needing to change the code within the style.css file of the parent theme.
4. Select the file you want to change and add your PHP/CSS code in the editor on the left side.
5. Click the Update File button when you're finished editing a file.

Plugin Installation

This theme requires the installation and activation of some plug-ins to add additional features and capabilities. If you want to use contact form, instagram, newsletter and demo import, you need to install the following plugins:

How to setup Contact Form

Form Code:

			                	
<div class="row g-5">
<div class="col-md-6">
[text* your-name placeholder "Name"]
</div>
<div class="col-md-6">
[email* your-email placeholder "Email Address"]
</div>
</div>
[text* subject placeholder "Subject"]
[textarea message 10x5 placeholder "Message"]
<div class="text-center">
[submit "Send Message"]
</div>

			                

Create Contact Form

1. Navigate to the Contact → Add New page in the WordPress admin.
2. Enter a name for Contact Form
3. Copy the code above into contact form
4. Click the Save button.

Insert Contact Form

How to setup Mailchimp

		                	
<p>Follow our latest stories.</p>
<div class="input-wrap">
<input type="email" name="EMAIL" placeholder="E-Mail" required />
<input type="submit" value="Subscribe">
</div>
		                	
		                

Create Mailchimp Form

1. Navigate to the Mailchimp for WP → Form in the WordPress admin.
2. Copy the code above into form code
3. Click the Save Changes button.

Install Demo Content

Well, it's really simple.

If you're using the theme to build a new website which doesn't have content yet, I strongly recommend you to use the demo content files.

1. Navigate to the Appearance → Import Demo Data in the WordPress admin
2. Click the Import Demo Data button

Import Kit Elementor

After installing demo data, if your page elementor doesn't have accent color, primary... same as my demo. Please import the file elementor-kit.zip into elementor

After import elementor kit please setup "Disable Default Colors", "Disable Default Colors"

Create Page width Templates Elementor

If your website already has data, do not want to install demo data. You want to create page elementor like demo, please import the template you want to use in elementor-template folder, afte insert it into the page you want to create

Creating Menus

You can manage and create menus by navigating to Appearance → Menus.

1. Click the create a new menu link.
2. Enter a name for the menu (this can be anything e.g "Main Menu").
3. Click the Create Menu button.
4. Select Pages you wanted to be appeared in Menu
5. Click on Add to Menu button
6. Drag menu item left-right to make it under another menu(sub menu).
7. Click Save Menu button

Site Style

Setting font family, font-size, color, background image your site

You can manage theme options by navigating to Appearance → Customize → Style Setting.

Typography Site

Color Site

Background Site

Header

You can manage theme options by navigating to Appearance → Customize → Header.

Site Identity

1. Choose logo or title
2. Upload logo if you choose logo style
3. Enter the information for site: Site Title, Tagline...
4. Setting typography for site title, tagline
5. Click the Published button.

Header Style

1. Set background header
2. Set Icon Color
3. Set Icon Hover Color

Main Menu Typography

1. Setting typography for main menu item
2. Setting color text link and hover for main menu item
3. Setting typography for sub menu item
4. Setting color text link and hover for sub menu item
5. Setting background color for sub menu
6. Setting border color for sub menu item
7. Click the Published button.

Social Network

You can manage theme options by navigating to Appearance → Customize

1. Click the tab Social Networks
2. Enter the links of your social networks if you want to display
3. Click the Published button.

Footer

You can manage theme options by navigating to Appearance → Customize → Footer.

1. Show/hide Instagram Footer
2. Enter title Instagram Feed
3. Enter subtitle Instagram Feed
4. Enter shortcode Instagram
5. Upload Footer Logo
6. Enter copyright text

Set Widget for Footer

Malistena Slide

Content Tab

Malistena Slides

1. Image: Choose an image from the media library
2. Image Size: Choose the size of the image, from thumbnail to full, or enter a custom size
3. Slide per Views:Select the number of slides to show at one time, available for desktop, tablet, and mobile devices
4. Navigation: Choose to display navigation Arrows, Dots, Both or None
5. Previous Arrow Icon: Set Icon for Previous Arrow
6. Next Arrow Icon: Set Icon for Next Arrow

Slider Options

1. Autoplay:Choose Yes or No to rotate slides automatically
2. Autoplay Speed:Set the time it takes for the next slide to start rotating. This time is in milliseconds, so 1000 ms is equal to 1 second.
3. Direction: Choose to have the slides rotate from left or right

Style Tab

Navigation

Arrows

1. Position: Set the position of the arrows inside or outside the slider
2. Size: Set the exact size of the arrows
3. Color: Set the color of the arrows

Arrows

1. Position: Set the position of the dots inside or outside the slider
2. Size: Set the exact size of the dots
3. Color:Set the color of the dots

Malistena Service

Content Tab

1. Choose Icon Image: Choosen Icon Image for Service Block
2. Sub Title: Insert the sub title for the Service Block
3. Title: Insert the title for the Service Block
4. Button: Enter text for button
5. Button Link: Enter link for button

Malistena Client

Tab Content

Malistena Clients

Shows a list of all the items in the slide. You can drag and drop them to change their order. Click on the Add Item button to add another item to the list.

1. Choose Image: Choose an image from the media library
2. Client Author: Enter client author
3. Client Quote: Enter client quote
4. View More Text: Enter customize the read more text
5. Client Link: Enter link for read more text

Slide Options

1. Navigation: Choose to display navigation Arrows, Dots, Both or None

Malistena Latest Posts

Latets Posts allows displaying the latest posts by category

Content Tab

• Select Category: Select the category you want to display
• Number Posts: Set the number of posts to display if paging is not available

Malistena Pricing Table

Content Tab

1. Pricing Icon: Select pricing icon
2. Title: Enter title for the Pricing Table
3. Price: Enter price for the Pricing Table
4. Pricing Featured: Enter pricing featured for Pricing Table
5. Pricing Button Text: Enter text for Pricing Button
6. Positon Button Link: Enter link for Pricing Button

Style Tab

Style Pricing

1. Background Color: Set color background for pricing table
2. Text Color: Set color text for pricing table

Button

1. Typography: Change the default typography options for the button’s text pricing table
2. Text Color: Select the color of the button’s color for both Normal and Hover states
3. Background Color: Select the button’s background color for both Normal and Hover states