How To Make Own WordPress Template For Travel Website

Shahid

April 27, 2026 . 18 min read

How To Make Own WordPress Template For Travel Website

Below is one possible complete WordPress theme structure and code that:

  1. Registers a custom post type called “Tours” (or “Packages”) with relevant meta fields.
  2. Renames the original Thrillophilia classes to new ElySpace classes (e.g., ElySpace_HandpickedCard__...).
  3. Replaces references to Thrillophilia with ElySpaceTravel.
  4. Integrates basic Elementor support so you can build and edit pages with Elementor.
  5. Makes the HTML “package listings” dynamic by pulling data from the custom post type.
  6. Provides a theme settings page (using standard WordPress options API) where you can add or manage certain text dynamically if desired.

This is a starter/foundation theme. You can refine, reorganize, and expand as needed.

Folder & File Structure

elyspace-travel-landing/
├── inc/
│   ├── custom-post-types.php     // CPT (Tours/Packages) registration
│   ├── custom-fields.php         // Optional: For custom meta fields (ACF or custom)
│   ├── theme-settings-page.php   // Optional: Admin page to manage theme settings
│
├── template-parts/
│   ├── hero.php                  // Example partial for Hero section
│   ├── packages-loop.php         // Listing of packages (dynamic from CPT)
│   └── footer-content.php        // Example partial for the custom Footer content
│
├── footer.php
├── front-page.php                // Landing/Home page template
├── functions.php
├── header.php
├── screenshot.png                // Theme screenshot (shown in WP Admin)
├── single-tour.php               // Single "Tour" custom post type template
├── archive-tour.php              // Archive listing for "Tours" (optional)
├── page.php                      // Default page template
├── style.css                     // Main theme stylesheet
└── readme.txt                    // Optional instructions

Note: The names and structure are flexible. Adjust them to fit your workflow.

1. style.css (Required Theme Header + Global Styles)

/*
Theme Name: ElySpace Travel Landing
Theme URI:  https://elyspace.com/web-design
Author:     ElySpace
Author URI: https://elyspace.com/web-design
Description: A modern WordPress theme optimized for travel business landing pages focusing on Kashmir tours.
Version:    1.0
Text Domain: elyspace-travel-landing
*/

/* Basic resets and global styles */
body {
  margin: 0;
  font-family: 'Open Sans', sans-serif;
  color: #333;
  background-color: #fff;
}

a {
  text-decoration: none;
  color: inherit;
}

/* Example gradient for backgrounds */
.elyspace-gradient-bg {
  background: linear-gradient(135deg, #00B4DB 0%, #0083B0 100%);
}

/* Hero Section Classes */
.ElySpaceHero_section {
  position: relative;
  text-align: center;
  color: #fff;
  padding: 80px 20px;
  background-size: cover;
  background-position: center;
}

.ElySpaceHero_heading {
  font-size: 48px;
  margin-bottom: 20px;
}

.ElySpaceHero_subheading {
  font-size: 24px;
  margin-bottom: 30px;
}

.ElySpaceHero_button {
  background-color: #ff7e5f;
  border: none;
  padding: 15px 30px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 16px;
}

/* Example classes for packages listing */
.ElySpacePackages_wrapper {
  margin: 40px 0;
}

.ElySpace_packageCard {
  border: 1px solid #eee;
  padding: 16px;
  border-radius: 6px;
  margin-bottom: 24px;
  background: #fff;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.ElySpace_packageCard img {
  width: 100%;
  border-radius: 4px;
}

.ElySpace_packageCard-title {
  font-size: 20px;
  font-weight: 600;
  margin: 12px 0 8px 0;
}

.ElySpace_packageCard-meta {
  font-size: 14px;
  color: #777;
  margin-bottom: 8px;
}

.ElySpace_packageCard-price {
  font-size: 18px;
  color: #f37002;
  font-weight: bold;
}

.ElySpace_packageCard-oldprice {
  text-decoration: line-through;
  margin-left: 10px;
  font-size: 16px;
  color: #999;
}

.ElySpace_packageCard-actions {
  margin-top: 12px;
}

.ElySpace_packageCard-actions button {
  background-color: #f37002;
  color: #fff;
  border: 0;
  padding: 10px 20px;
  border-radius: 4px;
  cursor: pointer;
}

/* Footer Classes */
.ElySpaceFooter_wrapper {
  background-color: #222;
  color: #aaa;
  padding: 40px 20px;
  text-align: center;
}

.ElySpaceFooter_heading {
  color: #fff;
  font-size: 18px;
  margin-bottom: 20px;
}

.ElySpaceFooter_link {
  display: block;
  color: #ccc;
  margin: 4px 0;
}

.ElySpaceFooter_link:hover {
  color: #fff;
}

.ElySpaceFooter_logo img {
  max-width: 200px;
}

2. functions.php (Theme Setup, Enqueue, CPT Includes, Admin Notice)

<?php
/**
 * Main functions for ElySpace Travel Landing Theme
 */

if (!defined('ABSPATH')) {
    exit; // Exit if accessed directly
}

add_action('after_setup_theme', 'elyspace_travel_landing_setup');
function elyspace_travel_landing_setup() {
    // Enable support for site title tag
    add_theme_support('title-tag');
    
    // Enable featured images
    add_theme_support('post-thumbnails');

    // Support Elementor
    add_theme_support('elementor');
    
    // Register primary menu
    register_nav_menus([
        'primary' => __('Primary Menu', 'elyspace-travel-landing'),
    ]);
}

// Enqueue Theme Scripts & Styles
add_action('wp_enqueue_scripts', 'elyspace_travel_landing_enqueue_assets');
function elyspace_travel_landing_enqueue_assets() {
    // Main stylesheet
    wp_enqueue_style('elyspace-main-style', get_stylesheet_uri(), [], '1.0');
    // Optionally enqueue scripts or additional CSS here
}

// Include custom post types file
require_once get_template_directory() . '/inc/custom-post-types.php';

// Optionally include custom fields or ACF config
require_once get_template_directory() . '/inc/custom-fields.php';

// Optionally include theme settings page
require_once get_template_directory() . '/inc/theme-settings-page.php';

// Admin notice upon activation
add_action('admin_notices', 'elyspace_travel_landing_admin_notice');
function elyspace_travel_landing_admin_notice() {
    $theme = wp_get_theme();
    if ($theme->get('Name') === 'ElySpace Travel Landing') {
        ?>
        <div class="notice notice-success is-dismissible">
            <p>
                <?php echo __('Welcome to the ElySpace Travel Landing Theme!', 'elyspace-travel-landing'); ?>
                <br>
                <?php echo __('Thanks for choosing our theme. Visit', 'elyspace-travel-landing'); ?> 
                <a href="https://elyspace.com/web-design" target="_blank">ElySpace</a> 
                <?php echo __('for more details or support.', 'elyspace-travel-landing'); ?>
            </p>
        </div>
        <?php
    }
}

3. inc/custom-post-types.php (Register the “Tour” CPT)

<?php
/**
 * Register Custom Post Type for Tours/Packages
 */

if (!defined('ABSPATH')) {
    exit;
}

// CPT: Tour (Packages)
function elyspace_register_tour_cpt() {
    $labels = [
        'name'               => __('Tours', 'elyspace-travel-landing'),
        'singular_name'      => __('Tour', 'elyspace-travel-landing'),
        'add_new'            => __('Add New Tour', 'elyspace-travel-landing'),
        'add_new_item'       => __('Add New Tour', 'elyspace-travel-landing'),
        'edit_item'          => __('Edit Tour', 'elyspace-travel-landing'),
        'new_item'           => __('New Tour', 'elyspace-travel-landing'),
        'view_item'          => __('View Tour', 'elyspace-travel-landing'),
        'search_items'       => __('Search Tours', 'elyspace-travel-landing'),
        'not_found'          => __('No Tours found', 'elyspace-travel-landing'),
        'not_found_in_trash' => __('No Tours found in Trash', 'elyspace-travel-landing'),
        'menu_name'          => __('Tours', 'elyspace-travel-landing'),
    ];

    $args = [
        'label'               => __('Tours', 'elyspace-travel-landing'),
        'labels'              => $labels,
        'description'         => __('Kashmir travel packages, curated by ElySpaceTravel', 'elyspace-travel-landing'),
        'public'              => true,
        'has_archive'         => true,
        'menu_icon'           => 'dashicons-palmtree',
        'rewrite'             => ['slug' => 'tours'],
        'supports'            => ['title', 'editor', 'thumbnail', 'excerpt'],
        'show_in_rest'        => true,
    ];
    register_post_type('tour', $args);
}
add_action('init', 'elyspace_register_tour_cpt');

4. inc/custom-fields.php (Optional – Custom Fields for Price, Old Price, Duration, etc.)

If you use ACF or another fields plugin, you can skip custom code. Otherwise, here’s a basic approach using WordPress’s native custom fields or the [Settings API]. For brevity, this example only shows how you might set up meta boxes for price/duration. You’d expand as needed.

<?php
/**
 * Basic example of adding custom meta boxes for Tours.
 */

if (!defined('ABSPATH')) {
    exit;
}

function elyspace_tour_add_meta_box() {
    add_meta_box(
        'elyspace_tour_meta',
        __('Tour Details', 'elyspace-travel-landing'),
        'elyspace_tour_meta_box_callback',
        'tour',
        'side',
        'default'
    );
}
add_action('add_meta_boxes', 'elyspace_tour_add_meta_box');

function elyspace_tour_meta_box_callback($post) {
    wp_nonce_field(basename(__FILE__), 'elyspace_tour_nonce');

    $saved_price      = get_post_meta($post->ID, '_elyspace_tour_price', true);
    $saved_old_price  = get_post_meta($post->ID, '_elyspace_tour_old_price', true);
    $saved_duration   = get_post_meta($post->ID, '_elyspace_tour_duration', true);
    
    ?>
    <p>
        <label for="elyspace_tour_price"><?php _e('Price (INR):', 'elyspace-travel-landing'); ?></label><br>
        <input type="number" name="elyspace_tour_price" id="elyspace_tour_price" value="<?php echo esc_attr($saved_price); ?>" style="width:100%;">
    </p>
    <p>
        <label for="elyspace_tour_old_price"><?php _e('Old Price (INR):', 'elyspace-travel-landing'); ?></label><br>
        <input type="number" name="elyspace_tour_old_price" id="elyspace_tour_old_price" value="<?php echo esc_attr($saved_old_price); ?>" style="width:100%;">
    </p>
    <p>
        <label for="elyspace_tour_duration"><?php _e('Duration (e.g., 6 days & 5 nights):', 'elyspace-travel-landing'); ?></label><br>
        <input type="text" name="elyspace_tour_duration" id="elyspace_tour_duration" value="<?php echo esc_attr($saved_duration); ?>" style="width:100%;">
    </p>
    <?php
}

function elyspace_tour_save_meta($post_id) {
    // Verify nonce
    if (!isset($_POST['elyspace_tour_nonce']) || !wp_verify_nonce($_POST['elyspace_tour_nonce'], basename(__FILE__))) {
        return;
    }
    // Bail if auto saving
    if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) {
        return;
    }
    // Check permissions
    if (isset($_POST['post_type']) && 'tour' === $_POST['post_type']) {
        if (!current_user_can('edit_post', $post_id)) {
            return;
        }
    }

    // Save each field
    $fields = [
        'elyspace_tour_price'     => '_elyspace_tour_price',
        'elyspace_tour_old_price' => '_elyspace_tour_old_price',
        'elyspace_tour_duration'  => '_elyspace_tour_duration',
    ];
    foreach ($fields as $field_form => $field_meta) {
        if (isset($_POST[$field_form])) {
            update_post_meta($post_id, $field_meta, sanitize_text_field($_POST[$field_form]));
        }
    }
}
add_action('save_post', 'elyspace_tour_save_meta');

5. inc/theme-settings-page.php (Optional – Simple Admin Page for Additional Theme Settings)

<?php
/**
 * Example theme settings page for ElySpace Travel Landing
 */

if (!defined('ABSPATH')) {
    exit;
}

// Create a new submenu under Appearance
add_action('admin_menu', 'elyspace_travel_landing_theme_settings_menu');
function elyspace_travel_landing_theme_settings_menu() {
    add_theme_page(
        __('ElySpace Theme Settings', 'elyspace-travel-landing'), 
        __('ElySpace Settings', 'elyspace-travel-landing'), 
        'manage_options', 
        'elyspace-theme-settings', 
        'elyspace_travel_landing_render_settings_page'
    );
}

function elyspace_travel_landing_render_settings_page() {
    ?>
    <div class="wrap">
        <h1><?php _e('ElySpace Travel Landing Settings', 'elyspace-travel-landing'); ?></h1>
        <form method="post" action="options.php">
            <?php
                settings_fields('elyspace_theme_settings_group');
                do_settings_sections('elyspace-theme-settings');
                submit_button();
            ?>
        </form>
    </div>
    <?php
}

// Register a setting to store custom text or disclaimers
add_action('admin_init', 'elyspace_travel_landing_register_settings');
function elyspace_travel_landing_register_settings() {
    register_setting('elyspace_theme_settings_group', 'elyspace_footer_disclaimer');
    
    add_settings_section(
        'elyspace_theme_settings_section', 
        __('Footer Disclaimer', 'elyspace-travel-landing'), 
        '__return_false', 
        'elyspace-theme-settings'
    );
    
    add_settings_field(
        'elyspace_footer_disclaimer',
        __('Footer Disclaimer Text', 'elyspace-travel-landing'),
        'elyspace_footer_disclaimer_field_html',
        'elyspace-theme-settings',
        'elyspace_theme_settings_section'
    );
}

// Callback for the text field
function elyspace_footer_disclaimer_field_html() {
    $value = get_option('elyspace_footer_disclaimer', '');
    echo '<textarea style="width: 100%; height: 80px;" name="elyspace_footer_disclaimer">' . esc_textarea($value) . '</textarea>';
}

6. header.php

<?php
/**
 * Theme header
 */
?><!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
    <meta charset="<?php bloginfo('charset'); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1" >
    <?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<?php wp_body_open(); ?>

<header class="ElySpace_header">
    <div class="ElySpace_header-inner" style="padding:10px 20px;">
        <div class="ElySpace_header-logo">
            <?php if (has_custom_logo()) {
                the_custom_logo();
            } else { ?>
                <a href="<?php echo esc_url(home_url('/')); ?>" class="site-title">
                    <?php bloginfo('name'); ?>
                </a>
            <?php } ?>
        </div>
        <nav class="ElySpace_header-menu">
            <?php
            wp_nav_menu([
                'theme_location' => 'primary',
                'container'      => false,
                'menu_class'     => 'ElySpace_primary-menu',
            ]);
            ?>
        </nav>
    </div>
</header>

7. footer.php

<?php
/**
 * Theme footer
 */
?>
<footer class="ElySpaceFooter_wrapper">
    <div class="ElySpaceFooter_logo">
        <a href="<?php echo esc_url(home_url('/')); ?>">
            <!-- Replace with your own brand/logo -->
            <img src="<?php echo esc_url(get_template_directory_uri() . '/assets/images/elyspace-logo-white.png'); ?>" alt="ElySpaceTravel Logo">
        </a>
    </div>

    <div class="ElySpaceFooter_heading"><?php _e('ABOUT ELYSPACETRAVEL', 'elyspace-travel-landing'); ?></div>
    <a class="ElySpaceFooter_link" href="#" target="_blank"><?php _e('ABOUT US', 'elyspace-travel-landing'); ?></a>
    <a class="ElySpaceFooter_link" href="#" target="_blank"><?php _e('WE ARE HIRING', 'elyspace-travel-landing'); ?></a>
    <a class="ElySpaceFooter_link" href="#" target="_blank"><?php _e('TERMS & CONDITIONS', 'elyspace-travel-landing'); ?></a>
    <a class="ElySpaceFooter_link" href="#" target="_blank"><?php _e('PRIVACY POLICY', 'elyspace-travel-landing'); ?></a>
    <a class="ElySpaceFooter_link" href="#" target="_blank"><?php _e('SUPPORT', 'elyspace-travel-landing'); ?></a>

    <p style="margin-top:20px;">
        <?php
            $disclaimer = get_option('elyspace_footer_disclaimer', '');
            if (!empty($disclaimer)) {
                echo wp_kses_post($disclaimer);
            } else {
                _e('© 2025 ElySpaceTravel. All rights reserved.', 'elyspace-travel-landing');
            }
        ?>
    </p>
</footer>

<?php wp_footer(); ?>
</body>
</html>

8. template-parts/hero.php (Example Hero Section Partial)

<?php
/**
 * Hero Section Partial
 */
$hero_background_image = get_template_directory_uri() . '/assets/images/default-hero-bg.jpg'; // Fallback image
?>
<section class="ElySpaceHero_section" style="background-image: url('<?php echo esc_url($hero_background_image); ?>');">
    <h1 class="ElySpaceHero_heading"><?php echo esc_html(get_theme_mod('hero_heading', 'Experience the Magic of Kashmir')); ?></h1>
    <p class="ElySpaceHero_subheading"><?php echo esc_html(get_theme_mod('hero_subheading', 'Unforgettable Kashmir Tours')); ?></p>
    <button class="ElySpaceHero_button" onclick="window.location.href='#packages';">
        <?php _e('Explore Our Tours', 'elyspace-travel-landing'); ?>
    </button>
</section>

You could also use Elementor to design your Hero section. This partial is just a fallback.

9. template-parts/packages-loop.php (Dynamic Listing of Tours)

Here we adapt the original snippet (with “HandPickedProductCard” etc.) to new classes (ElySpaceHandpickedCard_...) and make it dynamic with a WP query. The HTML is simplified; you can adapt the complex snippet exactly as you wish. The crucial part is we’re looping over custom post type data.

<?php
/**
 * Packages (Tours) Loop
 */

// Example query – fetch published tours
$args = [
    'post_type'      => 'tour',
    'posts_per_page' => 6,
];
$query = new WP_Query($args);
?>

<div class="ElySpacePackages_wrapper" id="packages">
    <h2 style="text-align:center;">Staff <span>Handpicked</span> – Curated with expertise</h2>
    <div class="ElySpacePackages_grid" style="display:flex; flex-wrap:wrap; gap:20px;">

    <?php if ($query->have_posts()) : ?>
        <?php while ($query->have_posts()) : $query->the_post(); 
            // Get custom fields
            $price      = get_post_meta(get_the_ID(), '_elyspace_tour_price', true);
            $old_price  = get_post_meta(get_the_ID(), '_elyspace_tour_old_price', true);
            $duration   = get_post_meta(get_the_ID(), '_elyspace_tour_duration', true);
        ?>
            <div class="ElySpace_packageCard" style="flex:1 1 calc(33% - 20px); min-width:300px;">
                <?php if (has_post_thumbnail()) : ?>
                    <div class="ElySpace_packageCard-img">
                        <a href="<?php the_permalink(); ?>">
                            <?php the_post_thumbnail('medium_large'); ?>
                        </a>
                    </div>
                <?php endif; ?>
                
                <div class="ElySpace_packageCard-content">
                    <?php if (!empty($duration)) : ?>
                        <div class="ElySpace_packageCard-meta">
                            <?php echo esc_html($duration); ?>
                        </div>
                    <?php endif; ?>
                    
                    <h3 class="ElySpace_packageCard-title">
                        <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
                    </h3>
                    
                    <div class="ElySpace_packageCard-price">
                        <?php if (!empty($price)) : ?>
                            <?php echo __('INR ', 'elyspace-travel-landing') . esc_html($price); ?>
                        <?php endif; ?>
                        <?php if (!empty($old_price)) : ?>
                            <span class="ElySpace_packageCard-oldprice">
                                <?php echo __('INR ', 'elyspace-travel-landing') . esc_html($old_price); ?>
                            </span>
                        <?php endif; ?>
                    </div>
                    
                    <div class="ElySpace_packageCard-actions">
                        <button onclick="window.location.href='tel:+918046287598'">
                            <?php _e('Request Callback', 'elyspace-travel-landing'); ?>
                        </button>
                    </div>
                </div>
            </div>
        <?php endwhile; wp_reset_postdata(); ?>
    <?php else : ?>
        <p><?php _e('No tours found.', 'elyspace-travel-landing'); ?></p>
    <?php endif; ?>
    
    </div>
</div>

Tip: If you want the exact markup from your large snippet, just rename those classes. The key difference is we’re pulling data from the WP database instead of hardcoding.

10. front-page.php (Landing Page Template)

This page pulls in the hero partial and packages loop partial. If you set a static front page in WP Settings → Reading, WordPress will use front-page.php for the homepage.

<?php
/**
 * Front Page Template
 */
get_header(); ?>

<!-- Hero Section Partial (fallback) -->
<?php get_template_part('template-parts/hero'); ?>

<!-- Optional: Additional content built with Elementor or manually below -->
<div class="container" style="max-width:1200px; margin:auto; padding:40px 0;">
    <!-- Packages Loop Partial -->
    <?php get_template_part('template-parts/packages-loop'); ?>
</div>

<?php get_footer();

If you want to build the entire page in Elementor, just create a new Page (“Home”), edit with Elementor, and set that page as the Front Page in WP. This front-page.php can remain as a fallback or minimal template.

11. single-tour.php (Single Tour Template)

Optional single view for a Tour. This can also be edited with Elementor if you allow editing of custom post types in Elementor settings.

<?php
/**
 * Single Tour Template
 */
get_header(); ?>

<div class="container" style="max-width:1000px; margin:auto; padding:40px;">
    <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
    
        <h1><?php the_title(); ?></h1>
        
        <?php if (has_post_thumbnail()) : ?>
            <div><?php the_post_thumbnail('large'); ?></div>
        <?php endif; ?>

        <?php 
            $price      = get_post_meta(get_the_ID(), '_elyspace_tour_price', true);
            $old_price  = get_post_meta(get_the_ID(), '_elyspace_tour_old_price', true);
            $duration   = get_post_meta(get_the_ID(), '_elyspace_tour_duration', true);
        ?>
        <p><strong><?php _e('Duration:', 'elyspace-travel-landing'); ?></strong> <?php echo esc_html($duration); ?></p>
        <p>
            <strong><?php _e('Price:', 'elyspace-travel-landing'); ?></strong>
            <?php if (!empty($price)) : ?>
                <?php echo __('INR ', 'elyspace-travel-landing') . esc_html($price); ?>
            <?php endif; ?>
            <?php if (!empty($old_price)) : ?>
                <span style="text-decoration:line-through; margin-left:10px;">
                    <?php echo __('INR ', 'elyspace-travel-landing') . esc_html($old_price); ?>
                </span>
            <?php endif; ?>
        </p>
        
        <div>
            <?php the_content(); ?>
        </div>
        
        <button style="margin-top:20px;" onclick="window.location.href='tel:+918046287598'">
            <?php _e('Request Callback', 'elyspace-travel-landing'); ?>
        </button>
    
    <?php endwhile; endif; ?>
</div>

<?php get_footer();

12. archive-tour.php (Optional Archive for “Tours”)

<?php
/**
 * Archive listing for Tour CPT
 */
get_header(); ?>

<div class="container" style="max-width:1200px; margin:auto; padding:40px;">
    <h1><?php post_type_archive_title(); ?></h1>
    <?php if (have_posts()) : ?>
        <div style="display:flex; flex-wrap:wrap; gap:20px;">
            <?php while (have_posts()) : the_post(); 
                $price     = get_post_meta(get_the_ID(), '_elyspace_tour_price', true);
                $old_price = get_post_meta(get_the_ID(), '_elyspace_tour_old_price', true);
                $duration  = get_post_meta(get_the_ID(), '_elyspace_tour_duration', true);
                ?>
                <div style="border:1px solid #ddd; padding:16px; width:30%;">
                    <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('medium'); ?></a>
                    <h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
                    <p><?php echo esc_html($duration); ?></p>
                    <p>
                        <strong><?php _e('Price: ', 'elyspace-travel-landing'); ?></strong>
                        <?php if ($price) {
                            echo 'INR ' . esc_html($price);
                        } ?>
                        <?php if ($old_price) {
                            echo '<span style="text-decoration: line-through; margin-left:10px;">INR ' . esc_html($old_price) . '</span>';
                        } ?>
                    </p>
                </div>
            <?php endwhile; ?>
        </div>
        
        <div style="margin-top:20px;">
            <?php the_posts_pagination(); ?>
        </div>
    <?php else : ?>
        <p><?php _e('No tours found.', 'elyspace-travel-landing'); ?></p>
    <?php endif; ?>
</div>

<?php get_footer();

How to Make it All Work:

  1. Zip the entire elyspace-travel-landing/ folder (with all files inside).
  2. Install in WordPress (Appearance → Themes → Add New → Upload Theme).
  3. Activate the theme.
  4. Go to Settings → Reading and set “Front page displays” to a Static page (which uses front-page.php). Or create a new page and design with Elementor.
  5. Add your tours under Tours in WP Admin. Fill in custom fields (price, old price, duration).
  6. Adjust the partial templates or styles to match the exact design from your snippet if needed.
  7. (Optional) Use the Theme Settings page in “Appearance → ElySpace Settings” to add a custom footer disclaimer or any other dynamic text you want.
  8. If you want to build with Elementor:
    • Go to Elementor → Settings → “Post Types” and enable “tour,” if you want to edit single tour pages with Elementor.
    • Create or edit any Page with Elementor and design visually. The theme’s CSS will remain as fallback.

Final Notes

  • The classes in your original snippet (HandPickedProductCard_, ProductCarousel_, etc.) have been replaced with simpler ElySpace_ classes in our example. If you want to preserve 1:1 styling from your reference code, copy/paste your existing HTML structure and rename the classes to avoid conflict.
  • By default, the data is now dynamic: you add/edit tours in the WordPress admin, and the front-end displays them accordingly.
  • This theme includes the minimal building blocks for a Kashmir landing page with a hero, dynamic tours, a custom footer, and Elementor compatibility.
  • For more advanced “carousel” behavior, you can integrate Slick Slider or Swiper.js and turn the package listing into a true carousel.

Use this as a starter and expand to match your exact design references. You now have:

  1. A complete WordPress theme folder & file structure.
  2. Elementor support out of the box.
  3. A dynamic approach via a custom post type and meta fields.
  4. A placeholders for your custom Hero, Footer, and package listing design.

Startups Blogs

Security Blogs

SSL Blogs