Subversion Repositories cheapmusic

<div class="container bg-3">

<p class="mt-3">In a nutshell, <b>Find Cheap Music</b> searches dozens of online stores for low-priced Compact Discs, Vinyl Records, Digital Downloads, Music Sheets and Music related books.</p>

<div class="shadow p-4 mb-4 bg-white">

<h3 id="contents" class="bg-primary px-2 py-2">Table of Contents</h3>

<ol>

<li><a href="#mainnav" class="btn align-baseline">Main Navigation Menu</a></li>

<li><a href="#homescreen" class="btn align-baseline">Main / Home Screen</a></li>

<li><a href="#searcg" class="btn align-baseline">Search Results</a></li>

<li><a href="#random" class="btn align-baseline">Random Results</a></li>

<li><a href="#coupons" class="btn align-baseline">Coupons and Special Offers</a></li>

<li><a href="#wishlist" class="btn align-baseline">Wishlist</a></li>

<li><a href="#login" class="btn align-baseline">Login / Registration</a></li>

</ol>

</div>

<div class="shadow p-4 mb-4 bg-white">

<h3 id="mainnav" class="bg-primary px-2 py-2">Main Navigation Menu</h3>

<img class="img-fluid" src="images/help/main_menu.png" alt="Main Menu">

<p class="mt-3">The main menu contains the home button (<i class="fas fa-home"></i>), links to the terms of service and privacy policy as well as a link to this help page (<i class="far fa-question-circle"></i>). Located on the right hand side is the login button. The main menu expands with links to the coupons / special offers and wishlist after logging in:<p>

<img class="img-fluid" src="images/help/main_menu_full.png" alt="Main Menu after login">

<p>After registration or a quick social login (using your Google, Facebook or Twitter account, you get access to a list of store coupons and special offers, are able to maintain a album wishlist or change the color theme.</p>

<div class="pt-3"><a href="#contents" class="btn border" title="Back to Top" data-toggle2="tooltip"><i class="fas fa-arrow-up"></i></a></div>

</div>

<div class="shadow p-4 mb-4 bg-white">

<h3 id="homescreen" class="bg-primary px-2 py-2">Main / Home Screen</h3>

<img class="img-fluid" src="images/help/search_bar.png" alt="Search Bar">

<p class="mt-3">The search bar consists of popups with search tips (<i class="fas fa-info-circle"></i>), the search filter (<i class="fas fa-filter"></i>) and the shipping destination (<i class="fas fa-shipping-fast"></i>) as well as the search term input box.</p>

<div class="modal-body bg-light text-dark">

  <div class="shadow p-4 mb-4 bg-white">

    <h4><i class="fas fa-filter"></i> Filter</h4>

    <img class="img-fluid" src="images/help/search_filter.png" alt="Search Filter">

    <p><span class=font-weight-bold>Condition:</span>

        <br>Select "New" and / or "Used". The standard is to search for both.</p>

    <p><span class=font-weight-bold>Media Type:</span>

        <br>Select <i class="fas fa-compact-disc category-icon-silver"></i> "CD", <i class="fas fa-dot-circle"></i> "Vinyl Record", <i class="fas fa-download"></i> "Digital" and / or <i class="fas fa-book-open"></i> "Book / Sheet Music". The standard is to search for all types.</p>

  </div>

  <div class="shadow p-4 mb-4 bg-white">

    <h4><i class="fas fa-shipping-fast"></i> Shipping To</h4>

    <img class="img-fluid" src="images/help/shipping_to_menu.png" alt="Shipping To Menu">

    <p><span class=font-weight-bold>Country / Currency:</span>

        <br>At this time only "United States" / "USD" are supported. The exchange rates are updated daily.</p>

    <p><span class=font-weight-bold>Zip Code:</span>

        <br>Enter your postal code to get the accurate shipping cost for items listed using a shipping rate table. The orange button color disappears when the zip code is populated.</p>

  </div>

  <div class="shadow p-4 mb-4 bg-white">

    <h4><i class="fas fa-search"></i> Search Keywords</h4>

    <img class="img-fluid" src="images/help/search_term.png" alt="Search Term">

    <p><span class=font-weight-bold>Barcode:</span>

        <br>The 12 or 13 digit barcode, normally located on the back, offers the best chance to find a specific album.</p>

    <p><span class=font-weight-bold>Artist and Title:</span>

        <br>The full name of the album, including artist and title, will usually lead to a specific album.</p>

    <p><span class=font-weight-bold>Just Artist or Title:</span>

        <br>Searches for artist or title alone will bring up multiple albums.</p>

  </div>

  <div class="shadow p-4 mb-4 bg-white">

    <p>During the search a popup with a percentage bar shows the progress. The percentage bar does not always move equally since some online stores provide the search results faster than others.</p>

    <img class="img-fluid" src="images/help/progress_bar.png" alt="Progress Bar">

  </div>

</div>

<div class="pt-3"><a href="#contents" class="btn border" title="Back to Top" data-toggle2="tooltip"><i class="fas fa-arrow-up"></i></a></div>

</div>

<div class="shadow p-4 mb-4 bg-white">

  <h3 id="searcg" class="bg-primary px-2 py-2">Search Results</h3>

  <p>The search delivers two different results. At the top is a card deck with up to 6 albums matching the search criteria. Each card shows the main information for the album. Additional links allow drilling into the track or video list, add the album to the wish list or search for online store listings. Below the card deck is a table with online listings sorted by total price ascending.</p>

  <div class="shadow p-4 mb-4 bg-white">

    <h4>Matching Albums Card Deck</h4>

    <img class="img-fluid" src="images/help/matching_albums.png" alt="Matching Albums">

  </div>

  <div class="shadow p-4 mb-4 bg-white">

    <h4>Detailed Albums Information</h4>

    <img class="img-fluid" src="images/help/album_info.png" alt="Album Info">

  </div>

  <div class="shadow p-4 mb-4 bg-white">

    <h4>Album Videos</h4>

    <img class="img-fluid" src="images/help/album_videos.png" alt="Album Info">

  </div>

  <div class="shadow p-4 mb-4 bg-white">

    <h4>Matching Listings</h4>

    <img class="img-fluid" src="images/help/search_results.png" alt="Search Results">

  </div>

  <div class="pt-3"><a href="#contents" class="btn border" title="Back to Top" data-toggle2="tooltip"><i class="fas fa-arrow-up"></i></a></div>

</div>

<div class="shadow p-4 mb-4 bg-white">

<h3 id="random" class="bg-primary px-2 py-2">Random Results</h3>

<img class="img-fluid" src="images/help/random_album_button.png" alt="Random Album Button">

<br>

<img class="img-fluid" src="images/help/random_albums.png" alt="Random Albums">

<br>

<div class="pt-3"><a href="#contents" class="btn border" title="Back to Top" data-toggle2="tooltip"><i class="fas fa-arrow-up"></i></a></div>

</div>

<div class="shadow p-4 mb-4 bg-white">

<h3 id="coupons" class="bg-primary px-2 py-2">Coupons and Special Offers</h3>

<p class="mt-3">This page shows the currently active coupons and special offers. The entries are updated on a weekly basis.<p>

<img class="img-fluid" src="images/help/coupons.png" alt="Coupon/Special Offers List">

<div class="pt-3"><a href="#contents" class="btn border" title="Back to Top" data-toggle2="tooltip"><i class="fas fa-arrow-up"></i></a></div>

</div>

<div class="shadow p-4 mb-4 bg-white">

<h3 id="wishlist" class="bg-primary px-2 py-2">Wishlist</h3>

<img class="img-fluid" src="images/help/wishlist.png" alt="Coupon/Wishlist">

</div>

<div class="shadow p-4 mb-4 bg-white">

<h3 id="login" class="bg-primary px-2 py-2">Login / Registration</h3>

<img class="img-fluid" src="images/help/login_screen.png" alt="Login Screen">

<div class="pt-3"><a href="#contents" class="btn border" title="Back to Top" data-toggle2="tooltip"><i class="fas fa-arrow-up"></i></a></div>

</div>

</div>