Aimed at helping people to up their eBay listing game, this video will show you how to make your base listing with Bootstrap. It’s the first part of the series where I be showing you how to make an eBay listing that is mobile-responsive and ranks well.

The code for this project can be found below if you struggle to follow the video at any point.

Source Code for A Mobile Reponsive eBay Listing

<link rel="stylesheet" href="https://truemiller.com/wp-content/uploads/2016/09/bootstrap.min.css">

<div class="container">
    <div class="jumbotron">
        <h1>Henry Hugglemonster Talking Henry 25cm Soft Toy</h1>
    </div>

    <div class="row">
        <div class="col-md-4" id="image-column">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h2 class="panel-title">
                        Images
                    </h2>
                </div>
                <div class="panel-body">
                    <div class="col-md-12">
                        <div class="thumbnail">
                            <img
                                    src="https://truemiller.com/wp-content/uploads/2016/09/81htnIcyADL._SL1500_.jpg"
                                    alt="">
                        </div>
                    </div>
                    <div class="col-xs-6">
                        <div class="thumbnail">
                            <img
                                    src="https://truemiller.com/wp-content/uploads/2016/09/71zgZ6i8c7L._SL1500_.jpg"
                                    alt="">
                        </div>
                    </div>
                    <div class="col-xs-6">
                        <div class="thumbnail">
                            <img
                                    src="https://truemiller.com/wp-content/uploads/2016/09/81tiuFWbbHL._SL1500_.jpg"
                                    alt="">
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-md-8" id="text-content">
            <div class="panel panel-default" id="features">
                <div class="panel-heading">
                    <h2 class="panel-title">Features</h2>
                </div>
                <div class="panel-body">
                    <ul>
                        <li>Press Henry's Tummy to hear him say 8 fun Henry phrases from the show; "I'm Henry
                            Hugglemonster"
                        </li>
                        <li>Made from super-soft fabrics making him the perfect cuddle companion for your little
                            ones!
                        </li>
                        <li>25cm tall.</li>
                        <li>Available as both Henry and Summer Characters.</li>
                        <li>Suitable From birth.</li>
                    </ul>
                </div>
            </div>
            <div class="panel panel-default" id="description">
                <div class="panel-heading">
                    <h2 class="panel-title">Description</h2>
                </div>
                <div class="panel-body">
                    <p>From the popular TV series Henry Hugglemonster, this Huggletastic Talking Henry soft toy is sure
                        to be a hit with any young fan! Henry's is 25cm tall and made from super soft fabrics making him
                        the perfect cuddle companion for your little ones! Bring Henry to life by pressing his tummy to
                        hear him say 8 of his phrases from the show; "I'm Henry Hugglemonster!" Also available from the
                        Henry Hugglemonster range is Huggletastic Talking Henry Soft Toy. Sold separately. Suitable from
                        birth.</p>
                </div>
            </div>
            <div class="panel panel-default" id="terms">
                <div class="panel-heading">
                    <h2 class="panel-title">Terms & Policies</h2>
                </div>
                <div class="panel-body">
                    <h3>Return Policy</h3>
                    <p>We don't accept returns</p>
                    <h3>Terms of Service</h3>
                    <p>If you purchase this good from us you owe us your soul.</p>
                </div>
            </div>
        </div>
    </div>
</div>

***

The next video will build on this listing. Keep your eyes peeled!

Until next time, Josh

Leave a Reply
You May Also Like

CPA: How to Make Money Offline with CPA

It was only a day or two ago when I was answering…

Java Scanner: How to Read Text Files in Java

The Scanner is super useful for taking user inputs. However, you might…