Show DevBest Habbo Maintenance Page HTML Code

westonallen0990

westonallen0990

Member
Apr 26, 2013
154
16
Hey DevBest! This is a Habbo Maintenance page layout!
DlYjSTc.png


HTML: 
<!DOCTYPE html>
 
 
    <title>Maintenance Break</title>
 
    <style type="text/css">
 
    body {
 
      font-family:"Tahoma",Verdana,Arial;
 
      font-size:13px;
 
      background: #3399CC repeat;
 
    }
 
    #container {
 
      background: #ffffff;
 
      width: 728px;
 
      margin: 15px auto 15px auto;
 
      padding: 10px; border: 2px solid black;
 
      -moz-border-radius: 5px;
 
      -webkit-border-radius: 5px;
 
      border-radius: 5px;
 
    }
 
    </style>
<div id="fb-root"></div>
<body>
 
 
<div id="container">
 
<b style="font-size: 150%;">{hotelname} Hotel <font color="red">Maintenance</font></b>
 
<br /><br />
<IMG SRC="http://habboemotion.com/resources/images/figures/Figure%20(4).gif"  ALIGN=LEFT>
    We are currently working on <strong>{hotelname}</strong>, and under-going a maintenance break.
<br>
<br>Please check back later and be aware of new changes, updates, and news! You can check all updates, we are making during this maintenance,
below, and maybe comment on some other changes we can make to make {hotelname} better!
<br><br>
<br><strong>Thanks for choosing our retro over the rest,</strong>
<br>{hotelname} Management & Staff!<br>
 
</div>
 
<div id="container">
 
<b style="font-size: 100%;">Updates</b><br><br>
 
Below you can find all the updates we are currently making during this maintenance page! <br>
Comment on other changes we should make.
<br>
<ul>
    <li>Better CMS</li>
    <li>Less Lag</li>
    <li>Customized Catalogue</li>
    <li>More furni/customs</li>
</div>
<div id="container">
 
<b style="font-size: 100%;">Questions? Comments? Complaints?</b><br><br>
Post them below via Twitter. We would also love to hear ideas on new updates for current/future maintenance breaks!
<br><br>
 
<a href="https://twitter.com/twitter" class="twitter-follow-button" data-show-count="false" data-size="large">Follow @twitter</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
 
</body>
 
</html>
 
St4nley

St4nley

Member
Apr 13, 2013
469
76
Not bad, kind of strange your integrating the style within the html code, should of seperated them. but with practice comes perfect,
 
Markshall

Markshall

Русский Стандарт
Contributor
Dec 18, 2010
2,637
2,389
Stanleh said:
Not bad, kind of strange your integrating the style within the html code, should of seperated them. but with practice comes perfect,
Click to expand...
It isn't strange, it's just bad practice.

But, I think he's sort of done the right thing here because the styling on this page will probably only be used for the maintenance page so there's no point creating a CSS file dedicated to it because if you need to change a CSS rule then you don't need to edit amongst several HTML files, just the one.

But not bad, looks decent. Nice work.
 
St4nley

St4nley

Member
Apr 13, 2013
469
76
Since you're already in the last box mentioning facebook, do this. go into a me page of lets say revcms or ubercms (depending which cms you want your page to support, it might work on both idk) and find out how to code a facebook widget in there if you don't know how to, for practical sakes change up the style of it, but if you can't code it then just rip it. Twitter might be cool too. up to you!
 
St4nley

St4nley

Member
Apr 13, 2013
469
76
i fixed your twitter issue
change the account name from
You must be registered for see links
on the first line to whatever

Code: 
<html><head></head><body>[HTML]
 
 
    <title>Remix of Maintenance Break</title>
 
    <style type="text/css">
 
    body {
 
      font-family:"Tahoma",Verdana,Arial;
 
      font-size:13px;
 
      background: #3399CC repeat;
 
    }
 
    #container {
 
      background: #ffffff;
 
      width: 728px;
 
      margin: 15px auto 15px auto;
 
      padding: 10px; border: 2px solid black;
 
      -moz-border-radius: 5px;
 
      -webkit-border-radius: 5px;
 
      border-radius: 5px;
 
    }
   
    #twitter {
 
      background: #ffffff;
 
      width: 728px;
 
      margin: 15px auto 15px auto;
 
      padding: 10px; border: 2px solid black;
 
      -moz-border-radius: 5px;
 
      -webkit-border-radius: 5px;
 
      border-radius: 5px;
      }
       
       
     
 
    </style>
<div id="fb-root"></div>
 
 
 
<div id="container">
 
<b style="font-size: 150%;">{hotelname} Hotel &lt;font color="red"&gt;Maintenance&lt;/font&gt;</b>
 
<br><br>
<img src="http://habboemotion.com/resources/images/figures/Figure%20(4).gif">
    We are currently working on <strong>{hotelname}</strong>, and under-going a maintenance break.
<br>
<br>Please check back later and be aware of new changes, updates, and news! You can check all updates, we are making during this maintenance,
below, and maybe comment on some other changes we can make to make {hotelname} better!
<br><br>
<br><strong>Thanks for choosing our retro over the rest,</strong>
<br>{hotelname} Management &amp; Staff!<br>
 
</div>
 
<div id="container">
 
<b style="font-size: 100%;">Updates</b><br><br>
 
Below you can find all the updates we are currently making during this maintenance page! <br>
Comment on other changes we should make.
<br>
<ul>
    <li>Better CMS</li>
    <li>Less Lag</li>
    <li>Customized Catalogue</li>
    <li>More furni/customs</li>
</ul></div>
<div id="container">
 
<b style="font-size: 100%;">Questions? Comments? Complaints?</b><br><br>
Post them below via Twitter. We would also love to hear ideas on new updates for current/future maintenance breaks!
<br><br>
  </div>
 
<div id="twitter">
  <h2> Follow Us On Twitter! </h2>
<a class="twitter-timeline" href="https://twitter.com/twitter" data-widget-id="364545172396204032">Tweets by @twitter</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
 
</div>
 
 
[/HTML]
</div></body></html>
 
Sysode

Sysode

Front-End Developer
Dec 11, 2012
1,673
848
This is a simple site, why is there an issue of "ripping" involved for it, lol?

Either way it's alright anf the use of internal css makes more sense as it's only one page. Also, could you maybe use margin's instead of <br/>, it looks a little neater.
 
KyleVonnie

KyleVonnie

Come @ me Bro!
Oct 26, 2011
993
176
Sysode said:
This is a simple site, why is there an issue of "ripping" involved for it, lol?

Either way it's alright anf the use of internal css makes more sense as it's only one page. Also, could you maybe use margin's instead of <br/>, it looks a little neater.
Click to expand...

I don't care if its a simple site or the most complex one in the world, ripping is ripping..
The coding is exactly the same, thus its ripping and isn't allowed here.
 
jayk

jayk

Retired Habbotard.
Sep 4, 2013
517
94
Looks clean.
Wouldn't use it on my retro, but it could be used on a website, if you change the text and images.
Thanks Weston!
 
S

Stallone

[◣_◢]
Feb 4, 2012
419
128
KyleVonnie said:
I don't care if its a simple site or the most complex one in the world, ripping is ripping..
The coding is exactly the same, thus its ripping and isn't allowed here.
Click to expand...
You didn't make it either? :p

Hey Devbest,
While looking through my files, I happened to come across this page which I coded a while back, so I decided I'd release it. I'm pretty sure I stole the design/layout from a retro, maybe BobbaLodge, I don't remember tbh?
Anyway here it is, I was just learning how to code when I made
Click to expand...
 

Users who are viewing this thread

Total: 2 (members: 0, guests: 2)
☀️  Switch to Light Theme

Latest posts

Top