How To Create Wapkiz Contact Page Design | About | Discliamer| Top | Wapkiz Tutrioail 2019
Step by step guide to create a stylish contact page in wapkiz.
Follow the Steps…
1. Create a new “contact” name page.
1. Create a new “contact” name page.
Step 1:Now Go To Footer,Paste This Code:
<style>.act {float: left;}.act a { display: inline-block; color: white; text-align: center; padding: 14px 15px; text-decoration: none;}.act a:hover { background-color: #111;}.active {padding:14px 15px; color: white; display: inline-block; text-align: center; text-decoration: none; background-color: #f44336; float: left; color: white;}.active a{color:white;}.top{background-color: #006699; float:left;padding: 7px;font-weight:bold;}.top a{color:white;display:inline-block;}.top:hover{background-color:#4863A0; color:red;font-weight:bold;} .top a:hover{color:#f87217;font-weight:bold;}</style><ul style=”list-style-type: none; margin: 0;padding: 0; overflow: hidden; background-color: #484f5b; border-top: 3px #006699 solid;”> <li class=”active”><a href=”/”>Home</a></li> <li class=”act”><a href=”/site-about.html”>About</a></li> <li class=”act”><a href=”/site-disclaimer.html”>Disclaimer</a></li> <li class=”act”><a href=”/site-contact.html”>Contact Us</a></li><li class=”top”><a href=”#top”>Top</a></li></ul> <div style=”padding:9px 14px; background:#f44336; bottom:0; font-size:12px;” align=”center”>Designed By – DaudTech.com</div>
Step2. Go to Bloglist and create a new post with bid “contact” as shown below
Step 3. Go to “Meta Header” and paste this below code there.
<link rel=”stylesheet” href=”https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css”>
Step 4: Add Css
cat{background:linear-gradient(#4078a5,#4785b8);border-radius:5px 5px 0px 0px;-webkit-border-radius:5px 5px 0px 0px;-moz-border-radius:5px 5px 0px 0px;padding:6px;font-weight:bold;font-size:1.1em;color:#fff;margin:7px 15px 7px 15px;}
.contact{background:#fff;text-align:center;padding:3px 3px 10px 3px;margin:0px 15px 7px 15px;}
.contact input[type=email]{background:#fff;border:1px solid #308bcf;padding:6px;color:#5c5c5c;font-weight:bold;width:300px;border-radius:3px;}
.contact textarea{border:1px solid #308bcf; width:305px; height: 100px;border-radius:3px;}
.contact input[type=submit]{background:#006699;color:#fff;font-weight:bold;padding:7px;width:305px;text-align:center;transition:0.3s;border:0px;border-radius:2px; }
.contact input[type=submit]:hover{background:#f44336; }
.error{background:#ffecec;color:red;text-transform:capitalize;border:1px #f5aca6 solid; border-radius:7px; padding:6px;margin:5px 10px;}
.contact{background:#fff;text-align:center;padding:3px 3px 10px 3px;margin:0px 15px 7px 15px;}
.contact input[type=email]{background:#fff;border:1px solid #308bcf;padding:6px;color:#5c5c5c;font-weight:bold;width:300px;border-radius:3px;}
.contact textarea{border:1px solid #308bcf; width:305px; height: 100px;border-radius:3px;}
.contact input[type=submit]{background:#006699;color:#fff;font-weight:bold;padding:7px;width:305px;text-align:center;transition:0.3s;border:0px;border-radius:2px; }
.contact input[type=submit]:hover{background:#f44336; }
.error{background:#ffecec;color:red;text-transform:capitalize;border:1px #f5aca6 solid; border-radius:7px; padding:6px;margin:5px 10px;}
Step 5 : Now go to “contact” page and paste below Contact Form Code
<div class=”cat”>Contact</div>
<div class=”contact”>[blogcmt_form]bid=contact,ud=site-contact.html?success,to=1||
(if :page_url:=:site_url:/site-contact.html?success)<div class=”alert alert-success alert-dismissible” align=”left”><a href=”#” class=”close” data-dismiss=”alert” aria-label=”close”>×</a> Thank You! We have receive your message. We Will Contact you soon.</div>(/if) %notify%
<b>Your Email:</b><br/>
<input type=”email” name=”blogcmt_name” pattern=”[a-z0-9._%+-]+@[a-z0-9.-]+.[a-z]{2,}” placeholder=”@”>
<br/>
<b>Your Message:</b>
<br/>
<textarea name=”blogcmt_text” pattern=”.{6,}”></textarea>
<br/>
<font color=”red”>Note. For movie related issue, mention the movie name.</font>
<br/>
<input type=”submit” name=”blogcmt_submit” value=”SEND”>
[/blogcmt_form]
<div class=”contact”>[blogcmt_form]bid=contact,ud=site-contact.html?success,to=1||
(if :page_url:=:site_url:/site-contact.html?success)<div class=”alert alert-success alert-dismissible” align=”left”><a href=”#” class=”close” data-dismiss=”alert” aria-label=”close”>×</a> Thank You! We have receive your message. We Will Contact you soon.</div>(/if) %notify%
<b>Your Email:</b><br/>
<input type=”email” name=”blogcmt_name” pattern=”[a-z0-9._%+-]+@[a-z0-9.-]+.[a-z]{2,}” placeholder=”@”>
<br/>
<b>Your Message:</b>
<br/>
<textarea name=”blogcmt_text” pattern=”.{6,}”></textarea>
<br/>
<font color=”red”>Note. For movie related issue, mention the movie name.</font>
<br/>
<input type=”submit” name=”blogcmt_submit” value=”SEND”>
[/blogcmt_form]
Done! You have successfully installed a beautiful contact form.
Make a contact page link to browse this page by users.
Now users can contact you from this page.
How to see the messages, send by users?
To see the messages, open Comment in your panel.
Step 6 : Now again Admin Panel Mode and create 2 Page about and Disclimer :
Step 7: Tow Page create Completed then about page Code Below:
<main><aside id=”desktop-sidebar”></aside> <article><h1 align=”center”>About</h1><div style=”border: 1px #ccc solid; padding: 6px;”><u><b>www.daudtech.com</b></u><br/><b>Product:</b> <i><u>It”s all about mp3 songs</u></i><p>Download Mp3 Songs absolutely free from our site. Below are the lists of type of songs you can download from here.</p><br/><ol type=”1″ style=”padding: 5px 20px;”><li>Bollywood Mp3 Songs</li><li>Bollywood Old Is Gold</li><li>Punjabi Hit Song</li><li>English Mp3 Song</li><li>Indian Pop Songs</li><li>Sad Songs</li><li>Love Romantic Song</li><li>Dj”s Collection</li><li>Unplugged Cover Songs</li></ol></div></article></main>
Step 8: Discliamer page Code Below:
<aside id=”desktop-sidebar”></aside> <article><h1 align=”center”>Disclaimer</h1><div class=”disclaimer”>Please Read The Disclaimer Before Download Anything From <a href=”/”><b>DaudTech.Com</b></a></div><div class=”disclaimer”>This is a promotional website only, All the downloadable content provided on this site (All materials) is for testing/ promotion purposes only. All files placed here are for introducing purpose.</div><div class=”disclaimer”>We highly ENCOURAGE users to BUY the CDs or DVDs of the movie or the music they like. Please, buy original Songs/contents from author or developer site!</div><div class=”disclaimer”>All files found on this site have been collected from various sources across the web and are believed to be in the “public domain”.</div><div class=”disclaimer”>All the logos and stuff are the property of their respective owners.<br/>If you are the rightful owner of any contents posted here, and object to them being displayed or If you are one of object to them being displayed or If you are one of representativities of copy rights department and you dont like our conditions of store, Please <a href=”/site-contact.html”><b>Contact Us</b></a>, We will remove it in 24 hour!</div><div class=”disclaimer”>Download at your own risk!!!</div></article></main>
For any further information please comment below.
COPYRIGHT: If you believe that any content on this site infringes your copyright,please send a takedown notice using a verifiable email address to: [email protected]We will review your request and respond promptly, typically within 2 business days, to address and remove any infringing content
