New Habbo.com Login/Register Page Rip [HTML/JS/IMAGES]

**BielzDev** · 04-03-13

Full RIP of the new habbo.com's index page.
Thanks Sulake :)

PS: Not coded (It's pure HTML/JS), but very simple to put on any CMS

Screenshots:

Download:
NewHabboIndex.zip
Mirror:
NewHabboIndex.zip (300 KB)
https://mega.co.nz/#!Y0gggTZD!MEJDiQ...hXb9yjPvcRMFr8

Update:
RevCMS version by Noman
http://forum.ragezone.com/f353/revcm...-index-915314/

uberCMS version by PythoneX12
http://forum.ragezone.com/f353/uberc...ew-com-915455/

**MentaL**

New Habbo.com Login/Register Page Rip [HTML/JS/IMAGES]

**Raultjuh** · 04-03-13

OMG XD I was like making this for my hotel and than my friend says on skype LOOK THAT POST and i am like -_____________-..

BUT REALLY Thanks for this Really thanks now i can use it and i don't need to work Thanks :)
~Raul~

**FapInc** · 04-03-13

Thank you so much for releasing !!!

**resize** · 04-03-13

Nice one! The index was dope :)

**Vrop93** · 05-03-13

Thanks :) I hated the old index

**iDamien** · 05-03-13

Thanks love this index!

**ChrisParadise** · 05-03-13

Thanks for this. I'm sure the power of ragezone will make this look much better!

**bradfell** · 05-03-13

Anyone going to make this for RevCMS?

Let me know! ;)

Thanks :D

**BielzDev** · 05-03-13

Originally Posted by bradfell

Anyone going to make this for RevCMS?

Let me know! ;)

Thanks :D

Here:
http://forum.ragezone.com/f353/revcm...-index-915314/

PS: Don't is made with my 'rip', but also seems good. ;)

**Serif Omeragic** · 05-03-13

There is also the HoloCMS?

**Riley H** · 05-03-13

I thought it'd be another day or two before someone ripped this. Although, it would have been a better release if you had integrated it with a CMS, good job. Cheers

**KyleeIsProzZ** · 05-03-13

Can someone, make this for UberCMS 2.0?

**Oblique** · 05-03-13

Making it for rev as we speak

**vista4life** · 05-03-13

Originally Posted by Oblique

Making it for rev as we speak

if someone can make this for ubercms i would be really great full. :)

**iRetro™** · 05-03-13

Thanks

**Marceline** · 05-03-13

Thanks!
teh index is so AWESOME!

**KyleeIsProzZ** · 05-03-13

Someone make the index for UberCMS 2.0.

Thank you.

**PythoneX12** · 05-03-13

For those who want it for UberCMS 2.0:

Replace ur page-fp.tpl with:

PHP Code:


<!DOCTYPE html>

<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->

<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->

<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->

<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->

<head>

    <meta charset="utf-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

    <title>Habbo Hotel - Make friends, join the fun, get noticed! </title>

    <meta name="viewport" content="width=device-width">



    <script>

        var andSoItBegins = (new Date()).getTime();

        var habboPageInitQueue = [];

        var habboStaticFilePath = "./web-gallery";

    </script>

    <link rel="shortcut icon" href="./web-gallery/images/v3/favicon.ico" type="image/vnd.microsoft.icon" />



    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Ubuntu:400,700,400italic,700italic">



<link rel="stylesheet" href="./web-gallery/static/styles/v3_landing.css" type="text/css" />

<script src="./web-gallery/static/js/v3_landing_top.js" type="text/javascript"></script>



        <meta name="description" content="Check into the world's largest virtual hotel for FREE! Meet and make friends, play games, chat with others, create your avatar, design rooms and more..." />

        <meta name="keywords" content="habbo hotel, virtual, world, social network, free, community, avatar, chat, online, teen, roleplaying, join, social, groups, forums, safe, play, games, online, friends, teens, rares, rare furni, collecting, create, collect, connect, furni, furniture, pets, room design, sharing, expression, badges, hangout, music, celebrity, celebrity visits, celebrities, mmo, mmorpg, massively multiplayer" />



<script src="./web-gallery/static/js/13389159.js"></script>

    <meta name="build" content="63-BUILD-FOR-PATCH-1591a - 04.03.2013 12:03 - com" />

    

</head>

<body>



<div id="overlay"></div>





<div id="change-password-form" class="overlay-dialog" style="display: none;">

    <div id="change-password-form-container" class="clearfix form-container">

        <h2 id="change-password-form-title" class="bottom-border">Forgot Password?</h2>

        <div id="change-password-form-content" style="display: none;">

            <form method="post" action="/account/password/identityResetForm" id="forgotten-pw-form">

                <input type="hidden" name="page" value="/?changePwd=true" />

                <span>Type in your Habbo account email address:</span>

                <div id="email" class="center bottom-border">

                    <input type="text" id="change-password-email-address" name="emailAddress" value="" class="email-address" maxlength="48"/>

                    <div id="change-password-error-container" class="error" style="display: none;">Please enter a correct email address</div>

                </div>

            </form>

            <div class="change-password-buttons">

                <a href="#" id="change-password-cancel-link">Cancel</a>

                <a href="#" id="change-password-submit-button" class="new-button"><b>Send Email</b><i></i></a>

            </div>

        </div>

        <div id="change-password-email-sent-notice" style="display: none;">

            <div class="bottom-border">

                <span>Hey, we just sent you an email with a link that lets you reset your password.<br>

<br>



NOTE! Remember to check your "junk" folder too!</span>

                <div id="email-sent-container"></div>

            </div>

            <div class="change-password-buttons">

                <a href="#" id="change-password-change-link">Back</a>

                <a href="#" id="change-password-success-button" class="new-button"><b>OK</b><i></i></a>

            </div>

        </div>

    </div>

    <div id="change-password-form-container-bottom" class="form-container-bottom"></div>

</div>



<script type="text/javascript">

    function initChangePasswordForm() {

        ChangePassword.init();

    }

    if (window.HabboView) {

        HabboView.add(initChangePasswordForm);

    } else if (window.habboPageInitQueue) {

        habboPageInitQueue.push(initChangePasswordForm);

    }

</script>







<header>

    <div id="border-left"></div>

    <div id="border-right"></div>



<div id="login-form-container">

    <a href="#home" id="habbo-logo"></a>



    <form action="/account/submit" method="post">



    

    <div id="login-columns">

        <div id="login-column-1">

           <label for="username">Username</label>

                    <br />

                <input type="text" name="credentials_username" id="username" />

                    <br />

            <input tabindex="5" type="checkbox" name="_login_remember_me" id="credentials-remember-me">

            <label for="credentials-remember-me" class="sub-label">Keep me logged in</label>

        </div>



        <div id="login-column-2">

            <label for="credentials-password">Password</label>

            <input tabindex="3" type="password" name="credentials.password" id="credentials-password">

            <a href="#" id="forgot-password" class="sub-label">Forgot your password?</a>

        </div>



        <div id="login-column-3">

            <input type="submit" value="Login" name="Login" style="margin: -10000px; position: absolute;">

            <a href="#" tabindex="4" class="button" id="credentials-submit"><b></b><span>Login</span></a>

        </div>



        <div id="login-column-4">

<div id="fb-root"></div>

<script type="text/javascript">

    window.fbAsyncInit = function() {

        Cookie.erase("fbsr_183096284873");

        FB.init({appId: '183096284873', status: true, cookie: true, xfbml: true});

        if (window.habboPageInitQueue) {

            // jquery might not be loaded yet

            habboPageInitQueue.push(function() {

                $(document).trigger("fbevents:scriptLoaded");

            });

        } else {

            $(document).fire("fbevents:scriptLoaded");

        }



    };

    window.assistedLogin = function(FBobject, optresponse) {

        

        Cookie.erase("fbsr_183096284873");

        FBobject.init({appId: '183096284873', status: true, cookie: true, xfbml: true});



        permissions = 'user_birthday,email';

        defaultAction = function(response) {



            if (response.authResponse) {

                fbConnectUrl = "/facebook?connect=true";

                Cookie.erase("fbhb_val_183096284873");

                Cookie.set("fbhb_val_183096284873", response.authResponse.accessToken);

                Cookie.erase("fbhb_expr_183096284873");

                Cookie.set("fbhb_expr_183096284873", response.authResponse.expiresIn);

                window.location.replace(fbConnectUrl);

            }

        };



        if (typeof optresponse == 'undefined')

            FBobject.login(defaultAction, {scope:permissions});

        else

            FBobject.login(optresponse, {scope:permissions});



    };



    (function() {

        var e = document.createElement('script');

        e.async = true;

        e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';

        document.getElementById('fb-root').appendChild(e);

    }());

</script>



<a class="fb_button fb_button_large" onclick="assistedLogin(FB); return false;">

    <span class="fb_button_text">Login with Facebook</span>

</a>





<div id="rpx-signin">

    <a class="rpxnow" onclick="return false;" href="https://login.habbo.com/openid/v2/signin?token_url=http%3A%2F%2Fwww.habbo.com/rpx">More ways to login</a>

</div>        </div>

    </div>

</form>

</div>



<script>

    habboPageInitQueue.push(function() {

        if (!LandingPage.focusForced) {

            LandingPage.fieldFocus('credentials-email');

        }

    });

</script>

    <div id="alerts">

<noscript>

<div id="alert-javascript-container">

    <div id="alert-javascript-title">

        Missing JavaScript support

    </div>

    <div id="alert-javascript-text">

        Javascript is disabled on your browser. Please enable JavaScript or upgrade to a Javascript-capable browser to use Habbo :)

    </div>

</div>

</noscript>



<div id="alert-cookies-container" style="display:none">

    <div id="alert-cookies-title">

        Missing cookie support

    </div>

    <div id="alert-cookies-text">

        Cookies are disabled on your browser. Please enable cookies to use Habbo.

    </div>

</div>

<script type="text/javascript">

</script>

    </div>

    <div id="top-bar-triangle"></div>

    <div id="top-bar-triangle-border"></div>

</header>





<div id="content">

    <ul>

        <li id="home-anchor">

            <div id="welcome">

                <a href="/register" class="button large" id="join-now-button"><b></b><span>Join today</span><span class="sub">(It's free)</span></a>

                <div id="slogan">

                    <h1>Welcome to Habbo,</h1>

                    <p>a strange place with awesome people.</p>

                    <p><a id="tell-me-more-link" href="#">Tell me more...</a></p>

                </div>

            </div>

            <div id="carousel">

                <div id="image1"></div>

                <div id="image2"></div>

                <div id="image3"></div>

                <div id="tell-me-more">Habbo Hotel is a virtual world for players 13 years and older, where you can create your very own Habbo character and design your room the way you like. You'll meet new friends, chat, organize parties, look after virtual pets, create and play games and complete quests. Click 'Join Today' to get started!</div>

            </div>

            <div id="floaters"></div>

        </li>



        <li id="registration-anchor">

<div id="registration-form">

    <div id="registration-form-header">

        <h2>User ID</h2>

        <p>Fill in these details to begin:</p>

    </div>

    <div id="registration-form-main">

        <form id="register-new-user" autocomplete="off">

        <input type="hidden" name="next" value="">

        <div id="registration-form-main-left">

            <label for="registration-birthday">Birthdate</label>

            <label for="registration-birthday" class="details">We will use this to restore your account if you ever lose access. Your birth date will never be shared publicly.</label>

            <div id="registration-birthday">

<select name="registrationBean.month" id="registrationBean_month" class="dateselector"><option value="">Month</option><option value="1">January</option><option value="2">February</option><option value="3">March</option><option value="4">April</option><option value="5">May</option><option value="6">June</option><option value="7">July</option><option value="8">August</option><option value="9">September</option><option value="10">October</option><option value="11">November</option><option value="12">December</option></select> <select name="registrationBean.day" id="registrationBean_day" class="dateselector"><option value="">Day</option><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option><option value="11">11</option><option value="12">12</option><option value="13">13</option><option value="14">14</option><option value="15">15</option><option value="16">16</option><option value="17">17</option><option value="18">18</option><option value="19">19</option><option value="20">20</option><option value="21">21</option><option value="22">22</option><option value="23">23</option><option value="24">24</option><option value="25">25</option><option value="26">26</option><option value="27">27</option><option value="28">28</option><option value="29">29</option><option value="30">30</option><option value="31">31</option></select> <select name="registrationBean.year" id="registrationBean_year" class="dateselector"><option value="">Year</option><option value="2005">2005</option><option value="2004">2004</option><option value="2003">2003</option><option value="2002">2002</option><option value="2001">2001</option><option value="2000">2000</option><option value="1999">1999</option><option value="1998">1998</option><option value="1997">1997</option><option value="1996">1996</option><option value="1995">1995</option><option value="1994">1994</option><option value="1993">1993</option><option value="1992">1992</option><option value="1991">1991</option><option value="1990">1990</option><option value="1989">1989</option><option value="1988">1988</option><option value="1987">1987</option><option value="1986">1986</option><option value="1985">1985</option><option value="1984">1984</option><option value="1983">1983</option><option value="1982">1982</option><option value="1981">1981</option><option value="1980">1980</option><option value="1979">1979</option><option value="1978">1978</option><option value="1977">1977</option><option value="1976">1976</option><option value="1975">1975</option><option value="1974">1974</option><option value="1973">1973</option><option value="1972">1972</option><option value="1971">1971</option><option value="1970">1970</option><option value="1969">1969</option><option value="1968">1968</option><option value="1967">1967</option><option value="1966">1966</option><option value="1965">1965</option><option value="1964">1964</option><option value="1963">1963</option><option value="1962">1962</option><option value="1961">1961</option><option value="1960">1960</option><option value="1959">1959</option><option value="1958">1958</option><option value="1957">1957</option><option value="1956">1956</option><option value="1955">1955</option><option value="1954">1954</option><option value="1953">1953</option><option value="1952">1952</option><option value="1951">1951</option><option value="1950">1950</option><option value="1949">1949</option><option value="1948">1948</option><option value="1947">1947</option><option value="1946">1946</option><option value="1945">1945</option><option value="1944">1944</option><option value="1943">1943</option><option value="1942">1942</option><option value="1941">1941</option><option value="1940">1940</option><option value="1939">1939</option><option value="1938">1938</option><option value="1937">1937</option><option value="1936">1936</option><option value="1935">1935</option><option value="1934">1934</option><option value="1933">1933</option><option value="1932">1932</option><option value="1931">1931</option><option value="1930">1930</option><option value="1929">1929</option><option value="1928">1928</option><option value="1927">1927</option><option value="1926">1926</option><option value="1925">1925</option><option value="1924">1924</option><option value="1923">1923</option><option value="1922">1922</option><option value="1921">1921</option><option value="1920">1920</option><option value="1919">1919</option><option value="1918">1918</option><option value="1917">1917</option><option value="1916">1916</option><option value="1915">1915</option><option value="1914">1914</option><option value="1913">1913</option><option value="1912">1912</option><option value="1911">1911</option><option value="1910">1910</option><option value="1909">1909</option><option value="1908">1908</option><option value="1907">1907</option><option value="1906">1906</option><option value="1905">1905</option><option value="1904">1904</option><option value="1903">1903</option><option value="1902">1902</option><option value="1901">1901</option><option value="1900">1900</option></select>             </div>

            <label for="registration-email">Email</label>

            <label for="registration-email" class="details">You'll need to use this <b>email address to log in</b> to Habbo in the future. Please use a valid address.</label>

            <input type="email" name="registrationBean.email" id="registration-email" value="">



            <label for="registration-password">Password</label>

            <label for="registration-password" class="details">Password must be at least <b>6 characters </b>long and include <b>letters and numbers</b></label>

            <input type="password" name="registrationBean.password" id="registration-password" maxlength="32" value="">

        </div>

        <div id="registration-form-main-right">

            <div id="captcha-container">



                <label for="recaptcha_response_field">Captcha</label>

                <label for="recaptcha_response_field" class="details">Type in the two words (separated with a space):</label>



                    <script src="./www.google.com/recaptcha/api/js/recaptcha_ajax.js"></script>

                    <script>

                        habboPageInitQueue.push(function() {

                            RecaptchaUtil.showRecaptcha("captcha-container", "6Ldq9wMAAAAAAMJQFwQLP7dUJMvlTD57af88caoD")

                        });

                    </script>

                    <div id="captcha-image-container">

                        <div id="recaptcha_image"></div>

                        <div id="captcha-overlay"></div>

                    </div>

                    <p id="captcha-new" class="details"><a class="recaptcha-reload" href="#">Try new code</a></p>

                    <input type="text" name="recaptcha_response_field" id="recaptcha_response_field">



            </div>

            <p class="checkbox-container" id="registration-tos">

                <input type="checkbox" id="tos" name="registrationBean.termsOfServiceSelection" value="true">

                <label for="tos" class="details checkbox">

                    I accept the <a href="http://help.habbo.com/entries/23096348-Terms-of-Service-and-Privacy-Policy" target="_blank" onclick="window.open('http://help.habbo.com/entries/23096348-Terms-of-Service-and-Privacy-Policy'); return false;">Terms Of Service</a> and Privacy Policy

                </label>

            </p>

            <p class="checkbox-container">



                <input type="checkbox" id="registration-marketing" value="true" name="registrationBean.marketing">

                <label for="registration-marketing" class="details checkbox">Keep me updated about the latest Habbo happenings, news and gossip!</label>

            </p>

            <div class="submit-button-wrapper">

                <a href="#" class="button large not-so-large register-submit"><b></b><span>Done</span></a>

            </div>

        </div>



        <div id="parent-email-container" style="display: none;">

            <label for="parent-email">Parents email</label>

            <label for="parent-email" class="details">Since you are under 15 years of age, we'll have to contact your parent(s) and inform that you have started to play Habbo.</label>

            <input type="email" id="parent-email" name="registrationBean.parentEmail" value="">

            <div class="submit-button-wrapper">

                <a href="#" class="button large not-so-large register-submit"><b></b><span>Done</span></a>

            </div>

        </div>

        </form>

    </div>

</div>

<div id="magnifying-glass"></div>

            <div id="sail"></div>

        </li>

    </ul>

</div>



<footer>

    <div id="age-recommendation"></div>



    <div id="footer-content">

        <div id="footer"><a href="http://help.habbo.com/">Customer Support</a> l <a href="https://help.habbo.com/forums/144065-information-for-parents">Parents</a> l <a href="https://help.habbo.com/entries/23096348-Terms-of-Service-and-Privacy-Policy" target="_new">Terms of Use & Privacy Policy</a> l <a href="https://help.habbo.com/entries/278050-infringements-policy" target="_new">Infringements</a> l <a href="safety/habbo_way.html" target="_new">Habbo Way</a> l <a href="safety/safety_tips.html">Safety</a> l <a href="mailto:advertising.com@sulake.com" target="_new">For Advertisers</a></div>

        <div id="copyright">© 2004 - 2013 Sulake Corporation Oy. HABBO is a registered trademark of Sulake Corporation Oy in the European Union, the USA, Japan, the People's Republic of China and various other jurisdictions. All rights reserved.</div>

    </div>

    <div id="sulake-logo"><a href="http://www.sulake.com/"></a></div>

</footer>





<script src="./web-gallery/static/js/v3_landing_bottom.js" type="text/javascript"></script>

<!--[if IE]><script src="./web-gallery/static/js/v3_ie_fixes.js" type="text/javascript"></script>

<![endif]-->







<script type="text/javascript">

    var cookieEnabled = (navigator.cookieEnabled) ? true : false;



    if (typeof navigator.cookieEnabled == "undefined" && !cookieEnabled)

    { 

        document.cookie="testcookie";

        cookieEnabled = (document.cookie.indexOf("testcookie") != -1) ? true : false;

    }

    if(!cookieEnabled)

    {

        $('#alert-cookies-container').show();

    }

    var rpxJsHost = (("https:" == document.location.protocol) ? "https://" : "http://static.");

    document.write(unescape("%3Cscript src='" + rpxJsHost +

            "rpxnow.com/js/lib/rpx.js' type='text/javascript'%3E%3C/script%3E"));

</script>

<script type="text/javascript">

    RPXNOW.overlay = false;

    RPXNOW.language_preference = 'en'; 

    RPXNOW.flags = 'show_provider_list';

</script>



<script type="text/javascript">

  var _gaq = _gaq || [];

  _gaq.push(['_setAccount', 'UA-448325-2']);

  _gaq.push(['_trackPageview']);

  (function() {

    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;

    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';

    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);

  })();

</script>    

    



    





</body>

</html>

And you should be good. Im currently doing the registration and such for Uber 2.0.

**DoctorX** · 05-03-13

Someone who code for HoloCMS please ? :b

**pel** · 05-03-13

Does it works with HoloCMS?

**BielzDev** · 05-03-13

Originally Posted by iExit

Does it works with HoloCMS?

Originally Posted by DoctorX

Someone who code for HoloCMS please ? :b

I'll make it ;D

**Leonard Louis** · 07-03-13

hey i need help my captcha can't work and i could not type anything in the captcha box and i can't register

**Brutten** · 29-05-13

Is there one for HabboPHP ?

New Habbo.com Login/Register Page Rip [HTML/JS/IMAGES]

Thread Tools

Search Thread