Adding a simple HTML Landing Page before a Wordpress Website
Question
I have been given a web application developed in Wordpress by another developer and I am not an expert in Wordpress as a framework.
Our webapp is hosted in SiteGround. What I am trying to do is add a simple HTML Template Landing Page with CSS and JS before the actual Wordpress site is loaded. I thought I could do this by adding a new index.php file on the root folder in SiteGround.
The reason I want to do this is because I want the landing page to have a different theme than the rest of the app. We are launching the website too soon for me to do it my preferred way (Django), so I just need this quick fix (even if it's a bit hacky) for the release date, so that then I can re-do the application in a better way.
Any ideas? I want to add something like this that then redirects to the Wordpress site: https://html5up.net/landed
1 answers
solution1
2 2017-04-13 19:31:22
Create landing page template & for making it different from the rest of the site you should create different header,footer files so that default won't be added in landing page. header-landing.php footer-landing.php Include both the header & footer files inside custom landing page template.
<?php
/*Template Name: Landing Page */
get_header('landing'); ?>
Put here html content of the landing page.
<?php get_footer('landing'); ?>
Customize your header file,only add those files that is required on landing page header.Please see the beloe code for adding different header styling in the same theme. save it as header-landing.php
<!DOCTYPE html>
<!--[if IE 7]>
<html class="ie ie7" <?php language_attributes(); ?>>
<![endif]-->
<!--[if IE 8]>
<html class="ie ie8" <?php language_attributes(); ?>>
<![endif]-->
<!--[if !(IE 7) & !(IE 8)]><!-->
<html <?php language_attributes(); ?>>
<!--<![endif]-->
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width">
<title><?php wp_title( '|', true, 'right' ); ?></title>
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">
<!--[if lt IE 9]>
<script src="<?php echo get_template_directory_uri(); ?>/js/example.js"></script>
<![endif]-->
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<div id="page" class="hfeed site landing">
<div id="main" class="site-main site-landing">
you can hide or remove extra css on the landing page header using its class "landing" and "site-landing".
For example .landing h1
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.