Feed

Usage Note

This should be used to pull in syndicated data from Principal's blog.

Feed Example

Retirement Options

Traditonal 401k vs. Roth 401k - What is the difference and what is right for me?

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi commodo, ipsum sed pharetra gravida, orci magna rhoncus neque, id pulvinar odio lorem non turpis. Nullam sit amet enim. Suspendisse id velit vitae ligula volutpat condimentum.

<div class="row">
  <div class="col-lg-6 col-md-9">
    <div class="media media-box">
      <img src="http://placehold.it/500x250" alt="" class="media-box-object">
        <section class="social-list social-list-no-margin social-list-sm">
          <ul>
            <li><a href="#placeholder" target="_blank"><i class="fa fa-facebook"></i></a></li>
            <li><a href="#placeholder" target="_blank"><i class="fa fa-twitter"></i></a></li>
            <li><a href="#placeholder" target="_blank"><i class="fa fa-linkedin"></i></a></li>
            <li><a href="#placeholder" target="_blank"><i class="fa fa-youtube-play"></i></a></li>
          </ul>
        </section>
      <div class="media-box-body">
        <h2 class="media-box-heading text-secondary">Retirement Options</h2>
          <h3><a href="#" class="text-dark-gray">
            Traditonal 401k vs. Roth 401k - What is the difference and what is right for me?
          </a></h3>
            <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi commodo, ipsum sed pharetra gravida, orci magna rhoncus neque, id pulvinar odio lorem non turpis. Nullam sit amet enim. Suspendisse id velit vitae ligula volutpat condimentum.</p>
      </div>
    </div>
  </div>
  <div class="col-lg-3 col-md-3">
    <div class="media media-box">
      <img src="http://placehold.it/300x150" alt="" class="media-box-object">
      <div class="media-box-body">
        <h3 class="media-box-heading text-secondary">Economic Trends</h3>
          <h4><a href="#" class="text-dark-gray">
            Act now, interest rates are on the rise again.
          </a></h4>
      </div>
    </div>
    <div class="media-box">
      <img src="http://placehold.it/300x150" alt="" class="media-box-object">
      <div class="media-box-body">
        <h3 class="media-box-heading text-secondary">Small Business</h3>
          <h4><a href="#" class="text-dark-gray">
            What every small business owner should know.
          </a></h4>
      </div>
    </div>
  </div>
  <div class="col-lg-3 col-md-12">
    <div class="media media-box">
      <h4 class="text-secondary">The Principal Blog</h4>
      <div class="media-box-body">
        <ul class="media-list">
          <li class="media">
            <a class="pull-left" href="#">
              <img src="http://placehold.it/50x50" alt="blog post image" class="media-box-object">
            </a>
            <a href="#"><div class="media-body text-dark-gray">
                <h4 class="media-heading">Saving enough for retirement?</h4>
                <span>January 2nd, 2014</span>
            </div></a>
          </li>
          <li class="media">
            <a class="pull-left" href="#">
              <img src="http://placehold.it/50x50" alt="blog post image" class="media-box-object">
            </a>
            <a href="#"><div class="media-body text-dark-gray">
              <h4 class="media-heading">Insurance basics and how to save.</h4>
              <span>January 2nd, 2014</span>
            </div></a>
          </li>
          <li class="media">
            <a class="pull-left" href="#">
              <img src="http://placehold.it/50x50" alt="blog post image" class="media-box-object">
            </a>
            <a href="#"><div class="media-body text-dark-gray">
              <h4 class="media-heading">How to protect your employees.</h4>
              <span>January 2nd, 2014</span>
            </div></a>
          </li>
          <li class="media">
            <a class="pull-left" href="#">
              <img src="http://placehold.it/50x50" alt="blog post image" class="media-box-object">
            </a>
            <a href="#"><div class="media-body text-dark-gray">
              <h4 class="media-heading">Invest in the future... today!</h4>
              <span>January 2nd, 2014</span>
            </div></a>
          </li>
          <li class="media">
            <a class="pull-left" href="#">
              <img src="http://placehold.it/50x50" alt="blog post image" class="media-box-object">
            </a>
            <a href="#"><div class="media-body text-dark-gray">
              <h4 class="media-heading">Do you have college-bound children?</h4>
              <span>January 2nd, 2014</span>
            </div></a>
          </li>
        </ul>
        <a class="pull-right" href="#">View All</a>
      </div>
    </div>
  </div>
</div>

Super Footer

<section class="social-list">
  <ul>
    <li><a href="#placeholder" target="_blank"><i class="fa fa-facebook"></i></a></li>
    <li><a href="#placeholder" target="_blank"><i class="fa fa-twitter"></i></a></li>
    <li><a href="#placeholder" target="_blank"><i class="fa fa-linkedin"></i></a></li>
    <li><a href="#placeholder" target="_blank"><i class="fa fa-youtube-play"></i></a></li>
  </ul>
</section>
<section class="nav-lower">
  <div class="row">
    <div class="col-md-3 nav-accordion-item" data-nav-accordion-accordionType="mobileonly">
      <div class="nav-accordion-heading"><a href="#placeholder">Get to Know Us</a></div>
      <ul class="nav-accordion-content">
        <li><a href="#placeholder">Company Overview</a></li>
        <li><a href="#placeholder">Corporate Social Responsibility</a></li>
        <li><a href="#placeholder">Investor Relations</a></li>
        <li><a href="#placeholder">News Room</a></li>
        <li><a href="#placeholder">Becoming a Supplier</a></li>
      </ul>
    </div>
    <div class="col-md-3 nav-accordion-item" data-nav-accordion-accordionType="mobileonly">
      <div class="nav-accordion-heading"><a href="#placeholder">We're Hiring!</a></div>
      <ul class="nav-accordion-content">
        <li><a href="#placeholder">Job Openings</a></li>
        <li><a href="#placeholder">Internships</a></li>
        <li><a href="#placeholder">Company Culture</a></li>
      </ul>
    </div>
    <div class="col-md-3 nav-accordion-item" data-nav-accordion-accordionType="mobileonly">
      <div class="nav-accordion-heading"><a href="#placeholder">Other Sites</a></div>
      <ul class="nav-accordion-content">
        <li><a href="#placeholder">For Advisors</a></li>
        <li><a href="#placeholder">Principal Funds</a></li>
        <li><a href="#placeholder">Principal Global Investors</a></li>
      </ul>
    </div>
    <div class="col-md-3 nav-accordion-item" data-nav-accordion-accordionType="mobileonly">
      <div class="nav-accordion-heading"><a href="#placeholder">Get Help</a></div>
      <ul class="nav-accordion-content help-nav">
        <li><i class="fa fa-phone"></i></span><a href="tel:800.986.3343">1.800.986.3343</a></li>
        <li><i class="fa fa-envelope"></i><a href="#placeholder" target="_blank">Contact Us</a></li>
        <li><i class="fa fa-map-marker"></i></span><a href="#placeholder">Find an Advisor</a></li>
      </ul>
    </div>
  </div>
</section>
<footer class="footer">
  <section class="bg-gray-lighter text-center text-muted footer-row">
    <nav>
      <ul class="nav nav-inline">
        <li><a href="#placeholder">Terms of Use</a></li>
        <li><a href="#placeholder">Disclosures</a></li>
        <li><a href="#placeholder">Privacy</a></li>
        <li><a href="#placeholder">Security</a></li>
        <li><a href="#placeholder">Report Fraud</a></li>
        <li><a href="#placeholder">Site Map</a></li>
        <li><a href="#placeholder">Contact Us</a></li>
      </ul>
    </nav>
    <div>
      <small>&copy; 2014 Principal Financial Services</small>
      <p style="color:red">Domain specific legal text to be listed under the copyright; to be defined by legal and compliance for each domain. For example: Principal.com will always include "Securities offered through Princor Financial Services Corporation, member SIPC"</p>
    </div>
  </section>
</footer>
<section class="social-list">
  <ul>
    <li><a href="#placeholder" target="_blank"><i class="fa fa-facebook"></i></a></li>
    <li><a href="#placeholder" target="_blank"><i class="fa fa-twitter"></i></a></li>
    <li><a href="#placeholder" target="_blank"><i class="fa fa-linkedin"></i></a></li>
    <li><a href="#placeholder" target="_blank"><i class="fa fa-youtube-play"></i></a></li>
  </ul>
</section>
<section class="nav-lower">
  <div class="row">
    <div class="col-xs-12">
      <ul class="nav nav-inline">
        <li><a href="tel:800.986.3343"><i class="fa fa-phone"></i> 1.800.986.3343</a></li>
        <li><a href="#placeholder" target="_blank"><i class="fa fa-envelope"></i> Contact Us</a></li>
        <li><a href="#placeholder"><i class="fa fa-map-marker"></i> Find an Advisor</a></li>
      </ul>
    </div>
  </div>
</section>
<footer class="footer">
  <section class="bg-gray-lighter text-center text-muted footer-row">
    <nav>
      <ul class="nav nav-inline">
        <li><a href="#placeholder">Terms of Use</a></li>
        <li><a href="#placeholder">Disclosures</a></li>
        <li><a href="#placeholder">Privacy</a></li>
        <li><a href="#placeholder">Security</a></li>
        <li><a href="#placeholder">Report Fraud</a></li>
        <li><a href="#placeholder">Site Map</a></li>
        <li><a href="#placeholder">Contact Us</a></li>
      </ul>
    </nav>
    <div>
      <small>&copy; 2014 Principal Financial Services</small>
      <p style="color:red">Domain specific legal text to be listed under the copyright; to be defined by legal and compliance for each domain. For example: Principal.com will always include "Securities offered through Princor Financial Services Corporation, member SIPC"</p>
    </div>
  </section>
</footer>

Contact an Advisor

Provides consistent UI for finding a nearby financial advisor.

Contact an Advisor example

Find a financial advisor near you:

We found 5 advisors within your area
<div class="text-center panel-group">
    <h1>Find a financial advisor near you:</h1>
    <span>We found <a href="#placeholder"><span>5</span> advisors</a> within your area</span>
</div>
<form role="form">
    <div class="row">
        <div class="col-md-3 col-md-offset-2">
            <select class="form-control">
                <option value="US">United States</option>
                <option value="Canada">Canada</option>
                <option value="Mexico">Mexico</option>
            </select>
        </div>
        <div class="col-md-3">
            <input class="form-control" type="text" placeholder="zip code">
        </div>
        <div class="col-md-2">
            <button class="btn btn-primary">Go</button>
        </div>
    </div>
</form>