Minecraft Blogs / Tutorial

How to create a Minecraft website on Weebly

  • 1,882 views, 2 today
  • 1
  • 1
  • 2
Moartx's Avatar Moartx
Level 8 : Apprentice Explorer
4
1.- Go to www.weebly.com

2.- Create an account

3.- Create your site

4.- Go to design

5.- Open Edit HTML/CSS

6.- Delete all and put this:

/* Resets
--------------------------------------------------------------------------------*/

ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, body, html, p, blockquote,
fieldset, input {
margin: 0;
padding: 0;
}

a img {
border: 0;
}

a {
text-decoration: none;
}

a:active, a:focus, textarea:focus, input:focus {
outline:none;
}

/* General Styling and Structure
--------------------------------------------------------------------------------*/

body {
font-family: Minecraft;
font-size: 13px;
color: #666666;
background: url(minecraft-esp.com/blog/wp-content/uploads/2012/10/fondo_mesp21.png) repeat;
}

.container {
margin: 0 auto;
width: 960px;
}

#header-wrap,
#banner-wrap,
#nav-wrap,
#main-wrap,
#footer-wrap
{
width:100%;
}

h3 {
font-family: Minecraft;
font-size:30px ;
color:#768c53;
font-weight:normal;
text-shadow: 1px 1px 0px #fff;
}

a {
color:#839b5c ;
}

a:hover {
color:#9b954e ;
}

h2 {
font-size: 36px ;
padding: .5em 0 .2em 0;
line-height: 1;
font-family: Minecraft;
font-weight: normal;
color: #3f3e3c;
text-shadow: 1px 1px 0px #fff;
}

p, blockquote {
font-size: 13px;
line-height: 1.5;
padding: .5em 0;
text-shadow: 1px 1px 0px #fff;
}

div#content {min-height:400px;}

/* Header
--------------------------------------------------------------------------------*/

#header-wrap {
padding-top:40px;
}

#logo,
#logo a {
font-family: Minecraft;
font-size:55px;
color:#fff;
letter-spacing:-2px;
text-shadow: 2px 2px 0px #353b26;
filter: dropshadow(color=#353b26, offx=2, offy=2);
}

#logo a:hover {}

#header {
border-collapse: collapse;
border-spacing: 0;
width:100%;
height: auto;
margin-bottom:10px;
}

#header td {
vertical-align: middle;
text-align: left;
}

#header-right {
text-align:right;
}

#header-right table {
float: right;
width: 1px;
position:relative;
right:-4px;
}

#header-right td {
padding: 0;
}

/* Header: Phone Number
--------------------------------------------------------------------------------*/

#header-right .phone-number {
color: #fff;
font-family:Minecraft;
display: block;
white-space: nowrap;
text-align:right;
margin-bottom:10px;
text-shadow: 1px 1px 0px #353b26;
}

#header-right .phone-number a {color:#eafcd6;}
#header-right .phone-number a:hover {color:#f5e9bf;}

/* Header: Social Links
--------------------------------------------------------------------------------*/

#header-right .wsite-social {
vertical-align: middle;
}

.wsite-social-item {
width: 25px;
height: 25px;
margin: 0 0 0 3px;
background-image:url(social-green.png);
}

.wsite-social-facebook {background-position:0 0;}
.wsite-social-facebook:hover {background-position:0 -25px;}
.wsite-social-facebook:active {background-position:0 -50px;}
.wsite-social-pinterest {background-position:-25px 0;}
.wsite-social-pinterest:hover {background-position:-25px -25px;}
.wsite-social-pinterest:active {background-position:-25px -50px;}
.wsite-social-twitter {background-position:-50px 0;}
.wsite-social-twitter:hover {background-position:-50px -25px;}
.wsite-social-twitter:active {background-position:-50px -50px;}
.wsite-social-linkedin {background-position:-75px 0;}
.wsite-social-linkedin:hover {background-position:-75px -25px;}
.wsite-social-linkedin:active {background-position:-75px -50px;}
.wsite-social-mail {background-position:-100px 0;}
.wsite-social-mail:hover {background-position:-100px -25px;}
.wsite-social-mail:active {background-position:-100px -50px;}
.wsite-social-rss {background-position:-125px 0;}
.wsite-social-rss:hover {background-position:-125px -25px;}
.wsite-social-rss:active {background-position:-125px -50px;}
.wsite-social-flickr {background-position:-150px 0;}
.wsite-social-flickr:hover {background-position:-150px -25px;}
.wsite-social-flickr:active {background-position:-150px -50px;}
.wsite-social-plus {background-position:-175px 0;}
.wsite-social-plus:hover {background-position:-175px -25px;}
.wsite-social-plus:active {background-position:-175px -50px;}
.wsite-social-vimeo {background-position:-200px 0;}
.wsite-social-vimeo:hover {background-position:-200px -25px;}
.wsite-social-vimeo:active {background-position:-200px -50px;}
.wsite-social-yahoo {background-position:-225px 0;}
.wsite-social-yahoo:hover {background-position:-225px -25px;}
.wsite-social-yahoo:active {background-position:-225px -50px;}
.wsite-social-youtube {background-position:-250px 0;}
.wsite-social-youtube:hover {background-position:-250px -25px;}
.wsite-social-youtube:active {background-position:-250px -50px;}

/* Header: Search Box
--------------------------------------------------------------------------------*/

#header-right .wsite-search {
vertical-align: middle;
height:29px;
margin-left:11px;
}

#header-right .wsite-search-input {
width: 129px;
padding: 7px 5px !important;
color:#666666 ;
font-size:11px ;
font-family:Minecraft;
background: url(search-bg.png) no-repeat ;
border:none;
}

#header-right .wsite-search-button {
position: relative;
width: 30px;
height: 39px;
margin-left: -3px ;
background: url(search-button.png) no-repeat;
}

/* Navigation
--------------------------------------------------------------------------------*/

#nav-wrap .container {
clear: both;
overflow: hidden;
position: relative;
background: url(nav-bg.jpg) repeat-x;
-webkit-box-shadow: 2px 0px 1px 0px rgba(0, 0, 0, 0.2);
box-shadow: 2px 0px 1px 0px rgba(0, 0, 0, 0.2);
}

#nav-wrap .container ul {
list-style: none;
float: left;
}

#nav-wrap .container ul li {
list-style: none;
float: left;
}

#nav-wrap .container ul li a {
float: left;
display: block;
font-family: Minecraft;
color: #fff;
text-decoration: none;
text-transform:uppercase;
padding:0px 25px ;
border: 0;
outline: 0;
font-size:12px ;
font-weight:bold;
line-height:47px;
background: url(nav-saperator.png) no-repeat right center;
}

#nav-wrap .container ul li:last-child a {
background:none;
}

#nav-wrap .container ul li#active a,
#nav-wrap .container ul li a:hover {
color: #9db366;
}

/* Navigation Submenu's
--------------------------------------------------------------------------------*/

#wsite-menus .wsite-menu li a {
font-family: Minecraft;
color: #fff;
text-decoration: none;
text-transform:uppercase;
padding:0px 15px ;
border: 0;
font-size:12px ;
font-weight:bold;
line-height:33px;
background: url(dropdown-bg-normal.jpg) repeat;
}

#wsite-menus .wsite-menu li a:hover {
background: url(dropdown-bg-active.jpg) repeat;
text-shadow: 1px 1px 0px #353b26;
}

#wsite-menus .wsite-menu li ul li a {
color:#2a2a29;
background: url(dropdown-submenu-normal.jpg) repeat;
border-bottom:1px solid #adafb3;
text-shadow: 1px 1px 0px #fff;
}

#wsite-menus .wsite-menu li ul li a:hover {
color:#5a6935;
background: url(dropdown-submenu-active.jpg) repeat;
text-shadow: 1px 1px 0px #fff;
}

/* Universal banner
--------------------------------------------------------------------------------*/

#banner {
position:relative;
}

#banner-wrap .container {
background: url(divider-wood-color.jpg) repeat bottom;
padding-bottom:9px;
-webkit-box-shadow: 2px 0px 1px 0px rgba(0, 0, 0, 0.2);
box-shadow: 2px 0px 1px 0px rgba(0, 0, 0, 0.2);
}

.banner-shadow {
background:url(banner-shadow.png)repeat-x top;
height:9px;
width:100%;
position:absolute;
top:0px;
left:0px;
z-index:1;
}

.banner-shadow-bottom {
background:url(banner-shadow.png)repeat-x top;
height:9px;
width:100%;
position:absolute;
bottom:0px;
left:0px;
z-index:1;
}

/* Page type: Tall header
--------------------------------------------------------------------------------*/

.tall-header-page .wsite-header {
width: 100%;
height: 337px;
background: url(banner-tall.jpg) no-repeat;
}

/* Page type: Short header
--------------------------------------------------------------------------------*/

.short-header-page .wsite-header {
width: 100%;
height: 208px;
background: url(banner-short.jpg) no-repeat;
}

/* Page type: No header
--------------------------------------------------------------------------------*/

.no-header-page .wsite-header {
display:none;
}

/* Page type: Landing page
--------------------------------------------------------------------------------*/

.landing-page #banner {
padding: 0;
}

#bannerleft {
float:left ;
width:534px ;
height: 337px;
position:relative;
}

.landing-page .wsite-header {
width: 100%;
height: 337px;
background: url(banner-landing.jpg) no-repeat;
}

#bannerright {
float:right ;
width: 346px;
height: 317px;
padding: 20px 40px 0;
background: url(banner-container.jpg) no-repeat;
}

#bannerright h2 {
color: #fff;
font-size: 36px;
padding: 43px 0px 15px ;
text-shadow: 1px 1px 0px #3f3c34;
}

#bannerright p {
color: #b7b5b0;
font-family: 'Antic Slab', serif;
font-size: 14px;
line-height:20px;
padding-bottom:25px ;
text-shadow: 1px 1px 0px #3f3c34;
}

#bannerright a {
color: #d4f6ae;
}

#bannerright a:hover {
color:#f7e09a;
}

/* Main Content
--------------------------------------------------------------------------------*/

#main-wrap .container {
background: url(content-bg.jpg) repeat-y;
-webkit-box-shadow: 2px 0px 1px 0px rgba(0, 0, 0, 0.2);
box-shadow: 2px 0px 1px 0px rgba(0, 0, 0, 0.2);
min-height:400px;
}

#main-wrap .container .container-top {
background: url(content-bg-top.jpg) no-repeat top left;
}
#main-wrap .container .container-bottom {
background: url(content-bg-bottom.jpg) no-repeat bottom left;
padding:30px 50px 40px;
}

#main-wrap .container h2 {
margin-bottom:3px;
}

#main-wrap .container h3 {
margin-top:17px;
}

#main-wrap .container p {
line-height:20px;
}

#main-wrap .paragraph ul {
padding-left:5px !important;
}

#main-wrap .paragraph li {
list-style:none !important;
background: url(list-bullet.png) no-repeat 0px 5px;
padding-left:30px !important;
}

#main-wrap .container blockquote {
color:#777;
font-style:Minecraft;
font-family:Minecraft;
line-height:20px;
padding-left:15px;
border-left:10px solid #b4b4b4;
margin:15px 0px 15px;
text-shadow: 1px 1px 0px #fff;
}

#main-wrap .container form .wsite-button {
margin-top:50px;
}

/* Footer
--------------------------------------------------------------------------------*/

#footer-wrap .container {
background: url(divider-wood-grey.jpg) repeat-x top;
padding-top:9px;
margin-bottom: 90px;
text-align:right;
-webkit-box-shadow: 2px 2px 1px 0px rgba(0, 0, 0, 0.2);
box-shadow: 2px 2px 1px 0px rgba(0, 0, 0, 0.2);
}

#footer-wrap .container-inner {
background: url(footer-bg.png) repeat;
padding:30px 40px 30px 50px;
color:#919191;
}

#footer-wrap ul {
text-align:left;
}

#footer-wrap p {
color: #919191;
font-size: 12px;
text-shadow: 1px 1px 1px #000;
}

#footer-wrap a {
color: #919191;
text-shadow: 1px 1px 1px #000;
}

#footer-wrap a:hover {
color: #839b5c;
}

#footer-wrap h2 {
font-size: 18px;
margin: 0 0 15px;
font-family:Minecraft;
font-weight: bold;
color:#ededed;
text-shadow: 1px 1px 1px #000;
}

#footer-wrap span {
vertical-align: middle;
}
#footer-wrap blockquote {
font-style:Minecraft;
border-left:4px solid #444;
margin:10px 0 10px 0;
padding-left:20px;
line-height:1.5;
text-shadow:none;
color:#666;
}

/* Footer Form Customization
--------------------------------------------------------------------------------*/

#footer-wrap .wsite-form-label {
display: inline-block;
padding:10px 0px 0px 0px ;
text-shadow: 1px 1px 1px #000;
}

#footer-wrap .wsite-form-container {
text-align:left;
margin-top:0 !important;
}

#footer-wrap .form-radio-container {
}

#footer-wrap .wsite-form-input {
color: #666;
border:1px solid #2c2b2a;
padding:5px;
height: 16px;
background:#fff;
}

#footer-wrap .form-select {
color: #666;
border:1px solid #c6c6c6;
padding: 2px 5px;
background:url(input-bg.jpg) no-repeat left top;
}

/* Form Customization
--------------------------------------------------------------------------------*/

.wsite-form-label {
display: inline-block;
padding:15px 0px 5px 0px ;
}

.wsite-form-input {
color: #666;
border:1px solid #c6c6c6;
padding:5px;
width: 385px;
height: 27px;
background: #fff url(input-bg.jpg) no-repeat left top;
}

.form-select {
color: #666;
border:1px solid #c6c6c6;
padding: 2px 5px;
width: 380px;
background:url(input-bg.jpg) no-repeat left top;
}

/* Buttons
--------------------------------------------------------------------------------*/

/* Small structure & regular style */

.wsite-button {
height:32px ;
display: inline-block;
padding: 0px 18px 0px 0px;
background: url(button.png) no-repeat 100% -96px ;
}

.wsite-button:hover {
background-position: 100% -128px;
}

.wsite-button:active {
background-position: 100% -160px;
}

.wsite-button-inner {
color: #ffffff !important;
font-family:Minecraft;
line-height: 32px;
height:32px;
display: block;
font-size: 15px;
font-weight: normal;
text-decoration: none;
text-transform: uppercase;
padding: 0 7px 0 25px;
background: url(button.png) no-repeat 0px 0px;
text-shadow: 1px 1px 0px #5b5b5b;
}

.wsite-button:hover .wsite-button-inner {
background-position: 0 -32px;
}

.wsite-button:active .wsite-button-inner {
background-position: 0 -64px;
}

/* Large structure & regular style */

.wsite-button-large {
color: #ffffff !important;
height: 45px;
background: url(button_large.png) no-repeat 100% -135px;
}

.wsite-button-large:hover {
background-position: 100% -180px;
}

.wsite-button-large:active {
background-position: 100% -225px;
}

.wsite-button-large .wsite-button-inner {
height: 45px;
line-height: 45px;
background: url(button_large.png) no-repeat 0px 0px;
}

.wsite-button-large:hover .wsite-button-inner {
background-position: 0px -45px;
}

.wsite-button-large:active .wsite-button-inner {
background-position: 0px -90px;
}

/* Highlighted styles */

.wsite-button-highlight {
background-image: url(button_highlight.png);
}

.wsite-button-highlight .wsite-button-inner {
background-image: url(button_highlight.png);
}

.wsite-button-large.wsite-button-highlight {
background-image: url(button_large_highlight.png);
}

.wsite-button-large.wsite-button-highlight .wsite-button-inner {
background-image: url(button_large_highlight.png);
}
Tags

Create an account or sign in to comment.

MrFlameYT
01/26/2017 2:34 pm
Level 37 : Artisan Geek
MrFlameYT's Avatar
Does not work
1
twit
04/25/2016 3:56 am
Level 33 : Artisan Crafter
twit's Avatar
Nice idea, but it won't work for me probably because I don't have the required media files (pictures etc.) stored on my local system (my own computer)
1

Welcome