[PUBLIC SAUCE] Code for my Website

Goggwell · November 12, 2014

Hey guys! I'm upgrading my site to version 2.0

So I figured I should share my old coding for my site with you guys!

Maybe you'll learn something new.

IF you want the whole .ZIP file, PM me

Here's the code:

<!DOCTYPE html>
<html lang="en">
 
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
 
    <title>Samuel's Site</title>
 
    <!-- Bootstrap Core CSS -->
    <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css">
 
    <!-- Fonts -->
    <link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href="css/animate.css" rel="stylesheet" />
    <!-- Squad theme CSS -->
    <link href="css/style.css" rel="stylesheet">
<link href="color/default.css" rel="stylesheet">
 
</head>
 
<body id="page-top" data-spy="scroll" data-target=".navbar-custom">
<!-- Preloader -->
<div id="preloader">
 <div id="load"></div>
</div>
 
    <nav class="navbar navbar-custom navbar-fixed-top" role="navigation">
        <div class="container">
            <div class="navbar-header page-scroll">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-main-collapse">
                    <i class="fa fa-bars"></i>
                </button>
                <a class="navbar-brand" href="index.html">
                    <h1>SAMUEL/GOGGWELL</h1>
                </a>
            </div>
 
            <!-- Collect the nav links, forms, and other content for toggling -->
            <div class="collapse navbar-collapse navbar-right navbar-main-collapse">
      <ul class="nav navbar-nav">
        <li class="active"><a href="#intro">Home</a></li>
        <li><a href="#about">Designs</a></li>
<li><a href="#service">Abilities</a></li>
<li><a href="#contact">Contact</a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
          <ul class="dropdown-menu">
            <li><a href="http://bisedu.or.id">BIS Official Website</a></li>
            <li><a href="#">Example menu</a></li>
            <li><a href="#">Example menu</a></li>
          </ul>
        </li>
      </ul>
            </div>
            <!-- /.navbar-collapse -->
        </div>
        <!-- /.container -->
    </nav>
 
<!-- Section: intro -->
    <section id="intro" class="intro">
 
<div class="slogan">
<h2>WELCOME TO <span class="text_color">MY PORTFOLIO</span> </h2>
<h4>CREATED WITH BOOTSTRAP AND HTML/CSS</h4>
</div>
<div class="page-scroll">
<a href="#service" class="btn btn-circle">
<i class="fa fa-angle-double-down animated"></i>
</a>
</div>
    </section>
<!-- /Section: intro -->
 
<!-- Section: about -->
    <section id="about" class="home-section text-center">
<div class="heading-about">
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<div class="wow bounceInDown" data-wow-delay="0.4s">
<div class="section-heading">
<h2>Designs</h2>
<i class="fa fa-2x fa-angle-down"></i>
 
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container">
 
<div class="row">
<div class="col-lg-2 col-lg-offset-5">
<hr class="marginbot-50">
</div>
</div>
        <div class="row">
            <div class="col-xs-6 col-sm-3 col-md-3">
<div class="wow bounceInUp" data-wow-delay="0.2s">
                <div class="team boxed-grey">
                    <div class="inner">
<h5>Design 1</h5>
                        <p class="subtitle">Frozen</p>
                        <div class="avatar"><img src="img/team/Frozen1.png" alt="" class="img-responsive img-circle" /></div>
                    </div>
                </div>
</div>
            </div>
<div class="col-xs-6 col-sm-3 col-md-3">
<div class="wow bounceInUp" data-wow-delay="0.5s">
                <div class="team boxed-grey">
                    <div class="inner">
<h5>Design 2</h5>
                        <p class="subtitle">Amps</p>
                        <div class="avatar"><img src="img/team/Annie779.jpg" alt="" class="img-responsive img-circle" /></div>
 
                    </div>
                </div>
</div>
            </div>
<div class="col-xs-6 col-sm-3 col-md-3">
<div class="wow bounceInUp" data-wow-delay="0.8s">
                <div class="team boxed-grey">
                    <div class="inner">
<h5>Design 3</h5>
                        <p class="subtitle">A Radar</p>
                        <div class="avatar"><img src="img/team/Radar3.jpg" alt="" class="img-responsive img-circle" /></div>
 
                    </div>
                </div>
</div>
            </div>
<div class="col-xs-6 col-sm-3 col-md-3">
<div class="wow bounceInUp" data-wow-delay="1s">
                <div class="team boxed-grey">
                    <div class="inner">
<h5>Design 4</h5>
                        <p class="subtitle">iOSGods</p>
                        <div class="avatar"><img src="img/team/sdsd.png" alt="" class="img-responsive img-circle" /></div>
 
                    </div>
                </div>
</div>
            </div>
        </div>
</div>
</section>
<!-- /Section: about -->
 
 
<!-- Section: services -->
    <section id="service" class="home-section text-center bg-gray">
 
<div class="heading-about">
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<div class="wow bounceInDown" data-wow-delay="0.4s">
<div class="section-heading">
<h2>What I Can Do</h2>
<i class="fa fa-2x fa-angle-down"></i>
 
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-lg-2 col-lg-offset-5">
<hr class="marginbot-50">
</div>
</div>
        <div class="row">
            <div class="col-sm-3 col-md-3">
<div class="wow fadeInLeft" data-wow-delay="0.2s">
                <div class="service-box">
<div class="service-icon">
<img src="img/icons/service-icon-1.png" alt="" />
</div>
<div class="service-desc">
<h5>Print</h5>
<p>I make print designs. They are not very good yet, but I will improve over time.</p>
</div>
                </div>
</div>
            </div>
<div class="col-sm-3 col-md-3">
<div class="wow fadeInUp" data-wow-delay="0.2s">
                <div class="service-box">
<div class="service-icon">
<img src="img/icons/service-icon-2.png" alt="" />
</div>
<div class="service-desc">
<h5>Web Design</h5>
<p>You can tell by this website. Web Designing is a passion of mine, which started right after the first ICT class.</p>
</div>
                </div>
</div>
            </div>
<div class="col-sm-3 col-md-3">
<div class="wow fadeInUp" data-wow-delay="0.2s">
                <div class="service-box">
<div class="service-icon">
<img src="img/icons/service-icon-3.png" alt="" />
</div>
<div class="service-desc">
<h5>Graphic Design</h5>
<p>I can create many things using Photoshop. I also use Pixelmator, Illustrator, Lightroom, Muse and a bunch of other products to create the perfect picture.</p>
</div>
                </div>
</div>
            </div>
<div class="col-sm-3 col-md-3">
<div class="wow fadeInRight" data-wow-delay="0.2s">
                <div class="service-box">
<div class="service-icon">
<img src="img/icons/service-icon-4.png" alt="" />
</div>
<div class="service-desc">
<h5>Coding</h5>
<p>I am a skilled coder and I have already mastered reverse engineering on iOS Games. I really enjoy coding, because it is fun (for me).</p>
</div>
                </div>
</div>
            </div>
        </div>
</div>
</section>
<!-- /Section: services -->
 
 
 
 
<!-- Section: contact -->
    <section id="contact" class="home-section text-center">
<div class="heading-contact">
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<div class="wow bounceInDown" data-wow-delay="0.4s">
<div class="section-heading">
<h2>Get in touch</h2>
<i class="fa fa-2x fa-angle-down"></i>
 
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container">
 
<div class="row">
<div class="col-lg-2 col-lg-offset-5">
<hr class="marginbot-50">
</div>
</div>
    <div class="row">
        <div class="col-lg-8">
            <div class="boxed-grey">
                <form id="contact-form">
                <div class="row">
                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="name">
                                Name</label>
                            <input type="text" class="form-control" id="name" placeholder="Enter name" required="required" />
                        </div>
                        <div class="form-group">
                            <label for="email">
                                Email Address</label>
                            <div class="input-group">
                                <span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span>
                                </span>
                                <input type="email" class="form-control" id="email" placeholder="Enter email" required="required" /></div>
                        </div>
                        <div class="form-group">
                            <label for="subject">
                                Subject</label>
                            <select id="subject" name="subject" class="form-control" required="required">
                                <option value="na" selected="">Choose One:</option>
                                <option value="service">Services</option>
                                <option value="suggestions">Suggestions</option>
                                <option value="product">Support</option>
                            </select>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="name">
                                Message</label>
                            <textarea name="message" id="message" class="form-control" rows="9" cols="25" required="required"
                                placeholder="Message"></textarea>
                        </div>
                    </div>
                    <div class="col-md-12">
                        <button type="submit" class="btn btn-skin pull-right" id="btnContactUs">
                            Send Message</button>
                    </div>
                </div>
                </form>
            </div>
        </div>
 
<div class="col-lg-4">
<div class="widget-contact">
<h5>Main Office</h5>
 
<address>
 <strong>Samuel Designs, ICT</strong><br>
 Jl. Surya Sumantri, No. 61<br>
 Bandung International School, ICT Class<br>
 <abbr title="Phone">P:</abbr> (022) 2040-595
</address>
 
<address>
 <strong>Email</strong><br>
 <a href="mailto:#">[email protected]<script type="text/javascript">
/*  */
</script></a>
</address>
<address>
 <strong>I'm on social networks</strong><br>
                        <ul class="company-social">
                            <li class="social-facebook"><a href="https://www.facebook.com/samuel.zulkarnaen" target="_blank"><i class="fa fa-facebook"></i></a></li>
                            <li class="social-twitter"><a href="https://www.twitter.com/" target="_blank"><i class="fa fa-twitter"></i></a></li>
                            <li class="social-dribble"><a href="https://dribbble.com" target="_blank"><i class="fa fa-dribbble"></i></a></li>
                            <li class="social-google"><a href="https://www.google.com" target="_blank"><i class="fa fa-google-plus"></i></a></li>
                        </ul>
</address>
 
</div>
</div>
    </div>
 
</div>
</section>
<!-- /Section: contact -->
 
<footer>
<div class="container">
<div class="row">
<div class="col-md-12 col-lg-12">
<div class="wow shake" data-wow-delay="0.4s">
<div class="page-scroll marginbot-30">
<a href="#intro" id="totop" class="btn btn-circle">
<i class="fa fa-angle-double-up animated"></i>
</a>
</div>
</div>
<p>©Copyright 2014 - Samuel. All rights reserved.</p>
</div>
</div>
</div>
</footer>
 
    <!-- Core JavaScript Files -->
    <script src="js/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/jquery.easing.min.js"></script>
<script src="js/jquery.scrollTo.js"></script>
<script src="js/wow.min.js"></script>
    <!-- Custom Theme JavaScript -->
    <script src="js/custom.js"></script>
 
</body>
 
</html>

Updated November 12, 2014 by DiDA

Rook · November 7, 2014

Impressive!

Should we also add another section for Coding?

Zahir · November 7, 2014

url of your site? so i can see how good it is

Goggwell · November 7, 2014

Impressive!

Should we also add another section for Coding?

If you want

I think it would be great

@Zahir I just added a button which links to my site

Updated November 7, 2014 by Goggwell

Gh0stByte · November 7, 2014

Impressive!

Should we also add another section for Coding?

Yeah, I'll fill it up

Rook · November 7, 2014

Yeah, I'll fill it up

General Coding or just Obj-C & Swift?

If you want

I think it would be great

@Zahir I just added a button which links to my site

You can use the ybutton also (had no other name for it )

[ybutton=http://gog.esy.es/squadfree]My Site[/ybutton]

[ybutton=http://gog.esy.es/squadfree]My Site[/ybutton]

I still need to fix them

malonglow · December 24, 2014

I am new to this page really new and I was wondering could you send me the zip file I am a beginner coder and it would be cool to check out this code so I can learn from it.