"Getting Started3"
Bootstrap 3.1.0 Snippet by palmdeezy

<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <di class="container"> <div id="top" class="jumbotron"> <h1 class="hero">Getting Started</h1> <p class="lead">An overview of Skiptu™, how to download your demo,<br> create an asset, upload it to your console, and more.</p> </div> <div class="row"> <div class="col-md-4"> <h3>Install</h3> <p>In the email with your login credentials, there is a link to a URL where your .apk file (that's your app) is hosted.</p> </div> <div class="col-md-4"> <h3>Design</h3> <p>An Adobe Photoshop template you can use to design your first lock screen asset.</p> </div> <div class="col-md-4"> <h3>Upload</h3> <p>Upload your first asset to your Skiptu™ Console.</p> </div> </div> <div class="row"> <div class="col-md-12 text-center"> <a href="#node/add/simpleads" class="btn btn-lg btn-success btn-outlined">Get Started</a> </div> </div> <h1 id="spage-header" class="page-header">Install your demo app</h1> <p class="lead">Follow these steps to install the demo app included in your email. </p> <h3>Configure your device</h3> <p>To optimize performance we suggest you disable the device's system lock screen: <ol> <li>Go to your device's <strong>Settings > Security</strong></li> <li>Tap <strong>Screen Lock</strong></li> <li>Select <strong>None</strong></li> </ol> <p>If you have a passcode set up on your device, go to our <a href="/faq/settings-security">Security & Settings</a> section in our FAQ for some tips for optimizing performance. </p> <div class="alert-message alert-message-warning"> <h4>Android 4.0+ Required</h4> <p>Your demo .apk will run on any Android device running Android 4.0 and above. If you are not sure what version of Android your device is running, go to <strong>Settings > About Phone</strong> and look for an item titled "Android version." If you do not have access to a device, please contact <a href="mailto:info@skiptu.com?Subject=[Skiptu.DemoDevice]" target="_top">info@skiptu.com</a> and we can send you one.</p> </div> <div class="alert-message alert-message-danger"> <h4>Disable other lock screen apps</h4> <p>If you are using any other replacement lock screen apps, please disable them.</p> </div> <h3>Install the .apk file</h3> <p>On the device you want to install the Skiptu™ demo app, open the link provided in the email to download the Skiptu.apk file. If you have never installed apps from outside of the Google Play Store before, please refer to highlighted section of the <a href="http://publishers.skiptu.com/faq/basics">FAQ</a> to install your demo. Otherwise, open your device's App Drawer and open Downloads. The Skiptu.apk should be at the top of the list. Tap it to open. Tap <strong>Install</strong>.</li> <div class="row" style="padding:10px"> <div class="col-sm-6 col-md-6 col-lg-6"> <img src="http://ec2-54-209-220-253.compute-1.amazonaws.com/sites/default/files/Downloads.jpg" class="img-responsive" alt="Downloads" > <h5><span class="text-muted">Find Skiptu.apk in your Downloads folder. Tap it to open.</span></h5> </div> <div class="col-sm-6 col-md-6 col-lg-6"> <img src="http://ec2-54-209-220-253.compute-1.amazonaws.com/sites/default/files/Install.jpg" class="img-responsive" alt="Install"> <h5><span class="text-muted">Install your Skiptu demo.</span></h5> </div> </div> <p>If you have any issues, please call the office or email Jared directly at <a href="mailto:jared@skiptu.com?Subject=[Skiptu.Demo]" target="_top">jared@skiptu.com</a>.</p> <div class="row"> <div class="col-md-12"> <h1 id="spage-header"class="page-header">Design your lock screen asset</h1> <h3>Select an image</h3> <p>Choose an image you'd like to turn into a lock screen wallpaper. Our server will accept images of almost any aspect ratio and attempt to crop and resize it for each device. However, we suggest you use the PSD template as a guide. For more information on image sizing, please visit the FAQ section <a href="faq/console">Images</a>.</p> <h3>Download the PSD template</h3> <p>Download the Adobe Photoshop template to help design your lock screen assets. Once downloaded, unzip the file. Open the SkiptuTemplate.psd file and get started. Use the guide to make sure your core content doesn't end up behind any lock screen elements. Once you're done with your design, save it as .png or .jpg file.</p> <a href="http://ec2-54-209-220-253.compute-1.amazonaws.com/sites/default/files/skiptu-template-0.3.zip" class="btn btn-lg btn-primary btn-outlined"><span class="glyphicon glyphicon-cloud-download"></span> PSD Template</a> </div> </div> <div class="row"> <div class="col-md-12"> <h1 id="spage-header"class="page-header">Upload a lock screen asset</h1> <h3>Create an asset</h3> <p>On publishers.skiptu.com, press the green button "Create Asset."</p> <ul> <li>Give the asset a name.</li> <li>Under <strong>Ad Type</strong>, select <strong>Image Ad</strong></li> <li>Upload your image. Make sure it is less than 2MB.</li> <li>Enter the URL Address of the destination you'd like the asset to be associated with. Users will be able to access this URL by dragging the lock icon on their devices to the left.</li> <li>Enter in an <strong>Active Date</strong> (e.g. "now") and an <strong>End Date</strong> (e.g. "now") for the asset.</li> <li>Press <strong>Save</strong>.</li> </ul> <div class="alert-message alert-message-info"> <h4>Optimal image size</h4> <p>While the best smartphones have screens 1080x1920, we suggest using images 1/2 that size--540x960. This results in a beautiful image and only uses 1/4 the memory, which improves performance and saves battery.</p> </div> <div class="alert-message alert-message-info"> <h4>Allowed date formats:</h4> <p>Now, tomorrow, next week, 10 September 2011, +1 day, +1 week, +1 year, +1 week 2 days 4 hours 2 seconds, next Monday, last Friday, mm/dd/yyyy hh:mm am/pm</p> </div> <p class="lead">Try it now.</p> <a href="http://publishers.skiptu.com/node/add/simpleads" class="btn btn-lg btn-success"><span class="glyphicon glyphicon-pencil"></span> Create Asset</a> <h3>Watch the magic happen. Rinse and repeat.</h3> <p>You're new asset will begin distribution within about 4 seconds to all the devices you installed the demo app on. For demonstrative purposes, images are set to randomly shuffle after each lock-to-unlock sequence. Depending on how many other assets you have created (or we have placed in your account to get you started), you should see your new asset appear within just a few sequences.</p> <h3>Manage your content</h3> <p>To manage your assets, go to <strong>My Assets</strong> located on the top navigation bar. Here you can view, edit, activate/deactivate, and delete your lock screen assets. Click on an asset's name to edit it.</p> </div> <div class="row"> <div class="col-md-12"> <h1 id="spage-header"class="page-header">Resources</h1> <h3><a href="http://publishers.skiptu.com/faq">Frequently Asked Questions</a></h3> <h3><a href="http://publishers.skiptu.com/contact-us">Contact Us</a></h3> </div> </div> </div>
.jumbotron{ width:100%; margin:0; } .btn-outlined { border-radius: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .btn-outlined.btn-primary { background: none; border: 3px solid #428bca; color: #428bca; } .btn-outlined.btn-primary:hover, .btn-outlined.btn-primary:active { color: #FFF; background: #428bca; border-color: #428bca: } .btn-outlined.btn-success { background: none; border: 3px solid #5cb85c; color: #5cb85c; } .btn-outlined.btn-success:hover, .btn-outlined.btn-success:active { color: #FFF; background: #47a447; } .btn-outlined.btn-info { background: none; border: 3px solid #5bc0de; color: #5bc0de; } .btn-outlined.btn-info:hover, .btn-outlined.btn-info:active { color: #FFF; background: #39b3d7; } .btn-outlined.btn-warning { background: none; border: 3px solid #f0ad4e; color: #f0ad4e; } .btn-outlined.btn-warning:hover, .btn-outlined.btn-warning:active { color: #FFF; background: #ed9c28; } .btn-outlined.btn-danger { background: none; border: 3px solid #d9534f; color: #d9534f; } .btn-outlined.btn-danger:hover, .btn-outlined.btn-danger:active { color: #FFF; background: #d2322d; } .alert-message { margin: 20px 0; padding: 20px; border-left: 3px solid #eee; } .alert-message h4 { margin-top: 0; margin-bottom: 5px; } .alert-message p:last-child { margin-bottom: 0; } .alert-message code { background-color: #fff; border-radius: 3px; } .alert-message-success { background-color: #F4FDF0; border-color: #3C763D; } .alert-message-success h4 { color: #3C763D; } .alert-message-danger { background-color: #fdf7f7; border-color: #d9534f; } .alert-message-danger h4 { color: #d9534f; } .alert-message-warning { background-color: #fcf8f2; border-color: #f0ad4e; } .alert-message-warning h4 { color: #f0ad4e; } .alert-message-info { background-color: #f4f8fa; border-color: #5bc0de; } .alert-message-info h4 { color: #5bc0de; } .alert-message-default { background-color: #EEE; border-color: #B4B4B4; } .alert-message-default h4 { color: #000; } .alert-message-notice { background-color: #FCFCDD; border-color: #BDBD89; } .alert-message-notice h4 { color: #444; }

Related: See More


Questions / Comments: