Futcha Splash

On a recent job, the client consistently demanded a splash page for their website. Despite my consistent groans and insistence that the implementation of a splash page on their website would instantly turn it, them and me to the dark side, I gave in.

I reluctantly implemented a quick solution using WordPress. I used php to check if the user was referred to the index page from within the site or from out with the site.

Usually splash pages use an “index.html” page in the website root with a link to a directory such as “blog“. But I had installed WordPress in the root. I could not be bothered moving the installation folder from the root to another folder to suit the splash page nonsense. So I used php with an if statement to check if the user was referred to the site from outside the domain or within and thus display content accordingly:

<?php
if( (strpos($_SERVER['HTTP_REFERER'], get_bloginfo('home')) === false) && !$_SERVER['QUERY_STRING']) :
?>
<html>
<head>
<title>Splash Page</title>
</head>
<body>
<h1><a href="http://www.yourwebsite.com">Enter</a></h1>
</body>
</html>
<?php else : ?>
<html>
<head>
<title>Main Page</title>
</head>
<body>
<h1>Welcome to the main page</h1>
<h2>By the way Alan is a total ledge!</h2>
</body>
</html>

In reference to the above code; all that is before the else statement i.e. the following code:

<html>
<head>
<title>Splash Page</title>
</head>
<body>
<h1><a href="http://www.yourwebsite.com">Enter</a></h1>
</body>
</html>

Will be the output splash page. All that is after the else statement i.e. the following code:

<html>
<head>
<title>Main Page</title>
</head>
<body>
<h1>Welcome to the main page</h1>
<h2>By the way Alan is a total ledge!</h2>
</body>
</html>

Will be output when the user clicks enter on the splash page.

  • http://www.hautter.com ana

    Thanks for the info… but what do you name the splash page with the php in the header? The instructions are kinda hard to follow.

  • http://www.indiestudio.ca Mike

    How would you set that first page up though I mean you can’t make it index.html because there is PHP code inside that page, and I can’t overwrite the index.php that’s already in the root can I?

    How does this work?

    Thanks

  • http://messytaco.com Brian

    Hey – Thanks for posting this solution. I’m doing some work on a site that will be hosting adult material. Because of this, the owners require a splash page with some disclaimer info.

    So, they only want this splash page to be displayed once for a user.

    I’ve taken your solution and applied it to my wordpress homepage. All seemed good while testing on firefox and chrome – but IE not so much…

    I can’t get past the splash page.

    Any thoughts on what to check. I’ve ensured all cookies are accepted.

    Thanks in advance!
    Brian

  • http://higginbottom.com bitkahuna

    ana and Mike – that code would go in index.php in your theme directory, or you could put it in a NEW php file and make that the template file for a static home page.

    wordpresshero – thanks for this, nice one! one minor thing, the display of code in your first box there is cut off to the right.

  • http://www.kynext.com Francesco Picchi

    Thanks, you saved me a lot of time….

    Franz

  • Dwaynne

    This one definitely needs some explaining. Since WP breaks down a single page into templates – index.php, header.php, etc – where exactly do you place this script?

  • Ed

    Does this actually work? I’m trying it with little success …

  • Jack

    Using HTTP_REFERER is *NOT* a good idea for directing your visitors anywhere and should not be relied on. As shown above in the comments, different browsers handle it differently. It can be turned off and on and edited by various security software / anti-tracking plugins and programs. You can easily turn it off in about:config for Firefox etc etc etc. All of which meaning you have no idea where your visitors will land on your site.

  • Pingback: links for 2009-06-16 - Yo What’s Up Dog

  • jpw

    Hi Guys,
    Why not just use the WordPress page structure and customize your homepage? You can set the homepage to “home.php” as the permalink in the admin. Then, for the index page you can just set the template to a custom template with the splash page hard-coded in the html. I’ll be doing this for a site of mine. I’ll post the link when it’s live.

  • http://bloggertips.cn Blogger tips

    Hey thank you for the simple and elegant information.

  • http://www.adriannasong.com Adrianna

    okay, I know I probably sound dumb asking this question, but I am so lost in this new language of trying to create my own site. My site will have adult content, And i am assuming what I need is a “splash page” but before anyone can access my blog, I’m hoping for a screen to pop up that will ask the person viewing if they are at least 18 yrs of age, which they will have to click before viewing its content.Does anyone know how to do this?

  • http://www.sm-circus.com dirksands

    Why you dont let CSS and browser history let do this job for you? Refferer and Cookies have ever a problem with paranoid browsers and proxy servers. Simply create a page “splash.htm” in the document root. Than try the following in the footer.php of your theme

    .splash a:link {
    background-color: #cd0000; position: absolute; width: 100%; min-height:100%; /* Mindesthöhe in modernen Browsern */
    height:auto !important; /* !important-Regel für moderne Browser, damit sie die nachfolgende height-Angabe ignorieren */
    height: 100%; /* Mindesthöhe im IE */
    left:0px; top: 0px; margin:0; padding:0; text-align: center; color: #FFFFFF; font-size: 28pt; vertical-align: middle; }
    .splash a:visited { display:none; }

    SPLASH SCREEN. READ THIS.

    This should also avoid some problems with search engine robots.

  • http://www.gldimages.info/ Photography

    I’ve just tried this without much success, could anyone tell me exactly where you put the code?

  • Akatobi2002

    these instructions are simpler: http://codex.wordpress.org/Creating_a_Static_Fr

  • vinit

    But Seo matters , otherwise put all links n homepage . But the post is about splash , the author said very well

  • Boris

    Thanks for this article. It helped me to the right path! I had a different scenario, where I wanted a splash page, followed by a static homepage. I also wanted both to be part of the WordPress, so the full website would be SEO-proof. Here's how I fixed it: http://www.ispace.nu/rainbow/archives/175
    Hope it helps some of you out!

  • Martin

    WOOOOOW!!!!!!!!!! you saved my day! At the end my client wanted a splash page. Your code was exactly what I was looking for.

    http://kobesculptures.com

    Thank you very much!!

  • Stef

    Martin, I need to do exactly what you did but I don't see any information clearly on how to do it. Can you assist? Thanks

    stef@serafindesigns.com

  • Stef

    I think it would be nice to know if this was made into index.php or what? There is no instructions on what the page is called.

  • Rachel_forshee

    God, so SMART! I was getting ready to migrate my site to another folder. Thank You!

  • Frank

    I got the same problem as Brian. Anyone knows a solution?

  • apo

    hi i've found this:
    http://cochinoman.com/2009/02/

    i'm gonna tryin this right now

  • Fsdafs

    Why not you use this simple solutions:

    1. Copy all in your index.php to newly created front-page.php

    2. In your new front-page.php, set template tag (see how to set page as template)

    3. In your new front-page.php, remove header, content, sidebar and footer.

    4. In your new front-page.php, include your content (pictures, video, flash or whatever).

    5. In your dashboard admin, create new page and name it ” whateveryoumaylike”.

    6. Set this “whateveryoumaylike” template page to front-page.php.

    7. Go to Setting –> Readings –> Set as “static” and select “whateveryoumaylike” as frontpage.

    And.. here you go a front page…

  • Megart04

    I thought it could be that easy, too – but all that shows up is my HTML code. Possible deleted too much out of the default template tag code? Going to check again now that someone has suggested it.

    I've been trying to modify the plugin Splashscreen for my needs (I just want a normal Splashscreen and not only for over +18. My html code works/looks good but then I'm restricted from entering my own site and can only view the splashscreen….)

  • janggeng.com

    when we must add a light component for splash

  • http://www.gottalottamarketing.com/outsource-marketing/outsourced-marketing Outsourced Marketing!!

    What if I set the page to NoIndex,nofollow!! WIll it unidex my homepage as well? in this same code:

    <title>Main Page</title>

    <h1>Welcome to the main page</h1>
    <h2>By the way Alan is a total ledge!</h2>

  • ISHAN SHARMA

    Best Tips to Secure WordPress Blog/Site here http://how-what.blogspot.com/2

  • http://www.websoftwareoutsourcing.com/ iphone apps developer india

    There's no doubt that this is the very good content, Very useful and informative post. Thanks for writing about this important topic.

  • http://www.vanadiumsite.com/ Richard Mowat

    dumb

  • http://www.facebook.com/kixjavier Kix Javier

    Hi I am really a newbie and i don't know much about coding and stuff. Where do I put this code?

  • Marc Avenel

    hi, page called? index.html or index.php or another name?
    thank you

  • Drixe

    Where to put the spalsh content ?

  • cindy

    How do I remove a Splash page, from a wordpress site.
    See link
    http://collicutt.com/

  • wags

    Thats how i would do it, but i am also going to create header-home.php and footer-home.php and remove any attributes that i dont need, and style things like header background etc with css, i.e changing heights, background images or make them transparent, this way you can still have all your necessary codes etc with little effort