Creating Service Page for Tourist Spot website in Gumby Foundation
Step 2: Creating Service Page
<< IndexIn the end of this tutorial, your services page will look like,
Step 2.1: Open Tourist Spot Layout page and renamed as service.html.
Step 2.1.1: Save the file and open it in your favorite browser, the web page will look like,
Step 2.2: Create title and add section for different services using grid.
<div class="row"> <div class="twelve columns"> <h4 class="text-center">Services</h4> <hr /> </div> </div> <div class="row"> <div class="four columns"> </div> <div class="four columns"> </div> <div class="four columns"> </div> </div>
Step 2.2.1: Save the file and open it in your favorite browser, the web page will look like,
Step 2.3: Add Services in each <div class="col-md-4"> using panel as shown in below.
<table> <thead><tr><th class="text-center">City</th></tr></thead> <tbody> <tr><td class="text-center">$1999.99</td></tr> <tr><td class="text-center">Everything Covered</td></tr> <tr><td class="text-center">1 Guide</td></tr> <tr><td class="text-center">VIP Room</td></tr> <tr><td class="text-center">50% Discount Food</td></tr> <tr><td class="text-center"><div class="medium primary btn"><a href="#">Buy Now</a></div></td></tr> </tbody> </table>
Step 2.3.2: Save the file and open it in your favorite browser, the web page will look like,