> <?php wp_title(); ?> __( 'You are viewing BluePrint-Q\'s sample elements page.', 'bpq' ), 'caption' => __( 'Works great for quickly viewing how BluePrint-Q tones and Bootstrap affect individual HTML elements.', 'bpq' ), 'is_dismissable' => false ); // Header. Note: This area is trimmed down quite a bit from the original header template. echo ''. '
'. tag_alert( $alert_args ). '
'; // The samples. echo '
'. '
'. '
'. '
'. sample_typography(). sample_buttons(). sample_panels(). '
'. '
'. sample_navigation(). sample_text_adornments(). sample_tables(). '
'. '
'. '
'. '
'. sample_form_controls(). sample_alerts(). '
'. '
'. sample_marquees(). '
'. '
'. '
'. '
'. sample_post_formats(). sample_images(). '
'. '
'. sample_progress_bars(). sample_lists(). sample_wells(). '
'. '
'; // Only display the stripe sample if the premium edition is in use // and the VC plugin is installed/activated. include_once( 'wp-admin/includes/plugin.php' ); if ( ( BPQ_EDITION >= 3 ) && is_plugin_active( 'js_composer/js_composer.php' ) ) { echo '
'. '
'. sample_stripes(). '
'. '
'; } // Only display the benefit/testimonial sample if the architect // edition is in use. if ( BPQ_EDITION >= 2 ) { echo '
'. '
'. sample_benefits(). '
'. '
'. sample_testimonials(). '
'. '
'. '
'. '
'. sample_banners(). '
'. '
'; } echo '
'. '
'; // Footer. Note: This area is trimmed down a bit from the original footer template. wp_footer(); echo ''; ?> '. '
'. __( 'Alerts', 'bpq' ). '
'. '
'. '
'. '
'. '
'. ''.__( 'Success!', 'bpq' ).' '.__( 'Plain', 'bpq' ). '
'. '
'. '
'. '
'. ''. ''.__( 'Info!', 'bpq' ).' '.__( 'With close', 'bpq' ). '
'. '
'. '
'. '
'. '
'. '
'. ''.__( 'Warning!', 'bpq' ).' '.__( 'With ', 'bpq' ).''.__( 'link', 'bpq' ).''. '
'. '
'. '
'. '
'. ''. ''.__( 'Danger!', 'bpq' ).' '.__( 'With close/', 'bpq' ).''.__( 'link', 'bpq' ).''. '
'. '
'. '
'. '
'. ''; } /** * Generates a sample panel with a banner. * @return string */ function sample_banners() { return '
'. '
'. __( 'Banners', 'bpq' ). '
'. '
'. '
'. '
'. '
'. do_shortcode( '[bpq_banner title="'.__( 'Left: heading #1', 'bpq' ).'" heading_size="h1" align="ml"]' ). do_shortcode( '[bpq_banner title="'.__( 'Left: heading #2', 'bpq' ).'" heading_size="h2" align="ml"]' ). '
'. '
'. do_shortcode( '[bpq_banner title="'.__( 'Center: heading #3', 'bpq' ).'" heading_size="h3" align="mc"]' ). do_shortcode( '[bpq_banner title="'.__( 'Center: heading #4', 'bpq' ).'" heading_size="h4" align="mc"]' ). '
'. '
'. do_shortcode( '[bpq_banner title="'.__( 'Right: heading #5', 'bpq' ).'" heading_size="h5" align="mr"]' ). do_shortcode( '[bpq_banner title="'.__( 'Right: heading #6', 'bpq' ).'" heading_size="h6" align="mr"]' ). '
'. '
'. '
'. '
'. '
'; } /** * Generates a sample panel with a benefit. * @return string */ function sample_benefits() { return '
'. '
'. __( 'Benefits', 'bpq' ). '
'. '
'. '
'. tag_benefit( array ( 'desc' => __( 'This is a benefit description.', 'bpq' ), 'icon' => '', 'title' => __( 'Benefit title', 'bpq' ), )). '
'. '
'. '
'; } /** * Generates a sample panel with various buttons. * @return string */ function sample_buttons() { return '
'. '
'. __( 'Buttons', 'bpq' ). '
'. '
'. '

'. ''. ' '. ''. ' '. ''. ' '. ''. ' '. ''. ' '. ''. ''. '

'. '
'. '
'. '
'. '

'. ''. ' '. ''. '

'. '

'. '

'. '

'. '
'. '
'. '

'. ' '.__( 'With icon', 'bpq' ).''. ' '. ''. ' '. ''. '

'. '

'. ''. ' '. ''. ' '. ''. '

'. '
'. '
'. '

'. ''. '

'. '
'. '
'; } /** * Generates a sample panel with inputs, selects, etc. * @return string */ function sample_form_controls() { return '
'. '
'. __( 'Form elements', 'bpq' ). '
'. '
'. '
'. '
'. ''. '
'. ''. '
'. ''. '
'. '
'. ''. ''. '
'. '
'. ''. '
'. ''. '
'. ''. '
'. ''. '
'. '
'. '
'. ''. ''. ''. '
'. '
'. ''. ''. ''. '
'. '
'. ''. ''. ''. '
'. '
'. '
'. ''. '
'. '
'. ''. '
'. '
'. ''. '
'. '
'. ''. '
'. ''. '
'. '
'. '
'. '
'; } /** * Generates a sample panel with images. * @return string */ function sample_images() { return '
'. '
'. __( 'Images', 'bpq' ). '
'. '
'. '
'. '
'. ''. '
'.__( 'Regular', 'bpq' ).'
'. '
'. '
'. ''. '
'.__( 'As a link', 'bpq' ).'
'. '
'. '
'. '
    '. '
  • '. ''. ''. ''. '
    '. __( 'As a media object', 'bpq' ). '
    '. '
  • '. '
'. '
'. '
'. '
'. '
'. '
'. ''. '
'.__( 'Rounded border', 'bpq' ).'
'. '
'. '
'. ''. '
'.__( 'Circle border', 'bpq' ).'
'. '
'. '
'. ''. '
'.__( 'Thumbnail border', 'bpq' ).'
'. '
'. '
'. '
'. '
'; } /** * Generates a sample panel with a number of different listings. * @return string */ function sample_lists() { return '
'. '
'. __( 'Lists', 'bpq' ). '
'. '
'. '
'. '
'. '
    '. '
  • '.__( 'Unordered list', 'bpq' ).'
  • '. '
  • '.__( 'Item A', 'bpq' ).'
  • '. '
      '. '
    • '.__( 'Item A1', 'bpq' ).'
    • '. '
    • '.__( 'Item A2', 'bpq' ).'
    • '. '
    '. '
  • '.__( 'Item B', 'bpq' ).'
  • '. '
  • '.__( 'Item C', 'bpq' ).'
  • '. '
'. '
'. '
    '. '
  1. '.__( 'Ordered list', 'bpq' ).'
  2. '. '
  3. '.__( 'Item A', 'bpq' ).'
  4. '. '
      '. '
    • '.__( 'Item A1', 'bpq' ).'
    • '. '
    • '.__( 'Item A2', 'bpq' ).'
    • '. '
    '. '
  5. '.__( 'Item B', 'bpq' ).'
  6. '. '
  7. '.__( 'Item C', 'bpq' ).'
  8. '. '
'. '
'. ''. '
'. '
'. '
'; } /** * Generates a sample panel with various marquee-related components. * @return string */ function sample_marquees() { return '
'. '
'. __( 'Marquees', 'bpq' ). '
'. '
'. ''. ''. '
'. '

'.__( 'Jumbotron', 'bpq' ).'

'. '

'.__( 'Example paragraph text in jumbotron. ', 'bpq' ).\ski\string::truncate( \ski\string::lorem(), 19, '' ).'

'. '

'.__( 'Example button in jumbotron', 'bpq' ).'

'. '
'. '
'. '
'; } /** * Generates a sample panel with navigation-related controls. * @return string */ function sample_navigation() { // OPTION: Scheme $opt_scheme = get_theme_mod( 'bpq_opt_navigation_scheme', 'tone' ); return '
'. '
'. __( 'Navigation', 'bpq' ). '
'. '
'. ''. '
'. ''. '
'. ''. '
'. '
'; } /** * Generates a sample panel with sample panels! * @return string */ function sample_panels() { return '
'. '
'. __( 'Panels', 'bpq' ). '
'. '
'. '
'. '
'. '
'. '
'.__( 'Panel', 'bpq' ).'
'. '
'. __( 'With embedded table', 'bpq' ). '
'. tag_table( 'table table-condensed', __( 'Table', 'bpq' ), 3 ). ''. '
'. '
'. '
'. '
'. '
'.__( 'Primary', 'bpq' ).'
'. '
'. __( 'With embedded list group', 'bpq' ). '
'. ''. ''. '
'. '
'. '
'. '
'. '
'.__( 'Success', 'bpq' ).'
'. '
'.__( 'Body', 'bpq' ).'
'. ''. '
'. '
'. '
'.__( 'Info', 'bpq' ).'
'. '
'.__( 'Body', 'bpq' ).'
'. ''. '
'. '
'. '
'. '
'. '
'.__( 'Warning', 'bpq' ).'
'. '
'.__( 'Body', 'bpq' ).'
'. ''. '
'. '
'. '
'.__( 'Danger', 'bpq' ).'
'. '
'.__( 'Body', 'bpq' ).'
'. ''. '
'. '
'. '
'. '
'. '
'; } /** * Generates a sample panel that displays post formats * (e.g. status, link, aside, etc). * @return string */ function sample_post_formats() { global $post, $sample; ob_start(); echo '
'. '
'. __( 'Post formats', 'bpq' ). '
'. '
'; // The 'content' ID has been added to get the regular styles too // Standard. $post->post_title = __( 'Standard post format example', 'bpq' ); $sample->post_content = '

'.\ski\string::lorem().'

'; $sample->post_thumbnail = ''; get_template_part( 'templates/template.content', '' ); // Aside. $sample->post_content = '

'. __( 'Aside post format example. It has '. 'no title and no post metadata. ', 'bpq' ). \ski\string::lorem(). '

'; $sample->post_thumbnail = ''; get_template_part( 'templates/template.content', 'aside' ); // Link. $post->post_title = '

'. __( 'Link post format example. Place the URL '. 'in the content area and the text to display in '. 'the title area', 'bpq' ). '

'; $sample->post_content = '#'; get_template_part( 'templates/template.content', 'link' ); // Quote. $post->post_title = __( 'Place the author in the title area', 'bpq' ); $sample->post_content = '

'.__( 'Quote post format example.', 'bpq' ).'

'; get_template_part( 'templates/template.content', 'quote' ); // Status. $post->post_title = __( 'Status post format example', 'bpq' ); $sample->post_content = '

'.__( 'The image to the left is the author\'s avatar.', 'bpq' ).'

'; get_template_part( 'templates/template.content', 'status' ); echo '
'. '
'; return ob_get_clean(); } /** * Generates a sample panel with progress bars. * @return string */ function sample_progress_bars() { return '
'. '
'. __( 'Progress bars', 'bpq' ). '
'. '
'. '
'. '
'. '
'. '
'. __( 'Basic', 'bpq' ). '
'. '
'. '
'. '
'. '
'. '
'. __( 'Basic w/ stripes', 'bpq' ). '
'. '
'. '
'. '
'. '
'. '
'. '
'. '
'. '
'. __( 'Success', 'bpq' ). '
'. '
'. '
'. '
'. __( 'Info', 'bpq' ). '
'. '
'. '
'. '
'. __( 'Warning', 'bpq' ). '
'. '
'. '
'. '
'. __( 'Danger', 'bpq' ). '
'. '
'. '
'. '
'. '
'. '
'. __( 'Success w/ stripes', 'bpq' ). '
'. '
'. '
'. '
'. __( 'Info w/ stripes', 'bpq' ). '
'. '
'. '
'. '
'. __( 'Warning w/ stripes', 'bpq' ). '
'. '
'. '
'. '
'. __( 'Danger w/ stripes', 'bpq' ). '
'. '
'. '
'. '
'. '
'. '
'. '
'. '
'. '
'. __( 'Active', 'bpq' ). '
'. '
'. '
'. '
'. '
'. '
'. __( 'Stacked', 'bpq' ). '
'. '
'. '
'. '
'. '
'. '
'. '
'. '
'. '
'. '
'; } /** * Generates a sample panel with Visual Composer rows - a.k.a. stripes.. * @return string */ function sample_stripes() { return '
'. '
'. __( 'Stripes', 'bpq' ). '
'. '
'. '
'. '
'. tag_stripe( __( 'No stripe', 'bpq' ), 'stripe' ). tag_stripe( __( 'Stripe #1', 'bpq' ), 'stripe stripe-1' ). tag_stripe( __( 'Stripe #2', 'bpq' ), 'stripe stripe-2' ). tag_stripe( __( 'Stripe #3', 'bpq' ), 'stripe stripe-3' ). tag_stripe( __( 'Stripe #4', 'bpq' ), 'stripe stripe-4' ). tag_stripe( __( 'Stripe #5', 'bpq' ), 'stripe stripe-5' ). '
'. '
'. '
'. '
'; } /** * Generates a sample panel various layout components. * @return string */ function sample_tables() { return '
'. '
'. __( 'Tables', 'bpq' ). '
'. '
'. '
'. '
'. tag_table( 'table table-striped', __( 'Table/stripes', 'bpq' ), 4 ). '
'. '
'. tag_table( 'table table-bordered table-hover', __( 'Borders/hover', 'bpq' ), 4 ). '
'. '
'. tag_table( 'table table-condensed', __( 'Thin/context', 'bpq' ), 5, array( 'active', 'success', 'info', 'warning', 'danger' ), array( __( 'Active', 'bpq' ), __( 'Success', 'bpq' ), __( 'Info', 'bpq' ), __( 'Warning', 'bpq' ), __( 'Danger', 'bpq' ) ) ). '
'. '
'. '
'. '
'; } /** * Generates a sample panel with a testimonial. * @return string */ function sample_testimonials() { return '
'. '
'. __( 'Testimonials', 'bpq' ). '
'. '
'. '
'. tag_testimonial( array ( 'align' => 'left', 'author' => __( 'Some person, CEO of company ABC', 'bpq' ), 'image' => 'http://lorempixel.com/100/100/people', 'quote' => __( 'This is where the quote goes. ', 'bpq' ).\ski\string::lorem(), )). '
'. '
'. '
'; } /** * Generates a sample panel with text adornments. * @return string */ function sample_text_adornments() { return '
'. '
'. __( 'Text adornments', 'bpq' ). '
'. '
'. '
'. '
'. '
    '. '
  • '.__( 'Small', 'bpq' ).'

  • '. '
  • '.__( 'Bold', 'bpq' ).'

  • '. '
  • '.__( 'Italics', 'bpq' ).'

  • '. '
  • '.__( 'Abbr', 'bpq' ).'

  • '. '
  • '.__( 'Init', 'bpq' ).'

  • '. '
  • '.__( 'Code', 'bpq' ).'

  • '. '
  • '.__( 'Keys', 'bpq' ).'

  • '. '
  • '.__( 'Badge', 'bpq' ).'

  • '. '
'. '
'. '
'. ''.__( 'Label', 'bpq' ).''. ' '. ''.__( 'Primary', 'bpq' ).''. ' '. ''.__( 'Success', 'bpq' ).''. ' '. ''.__( 'Info', 'bpq' ).''. ' '. ''.__( 'Warning', 'bpq' ).''. ' '. ''.__( 'Danger', 'bpq' ).''. '
'. '
'. '
'. '
'. '
    '. '
  • '.__( 'Text', 'bpq' ).'

  • '. '
  • '.__( 'Muted', 'bpq' ).'

  • '. '
  • '.__( 'Success', 'bpq' ).'

  • '. '
  • '.__( 'Info', 'bpq' ).'

  • '. '
  • '.__( 'Warning', 'bpq' ).'

  • '. '
  • '.__( 'Danger', 'bpq' ).'

  • '. '
'. '
'. '
'. '
    '. '
  • '.__( 'Background', 'bpq' ).'

  • '. '
  • '.__( 'Success', 'bpq' ).'

  • '. '
  • '.__( 'Info', 'bpq' ).'

  • '. '
  • '.__( 'Warning', 'bpq' ).'

  • '. '
  • '.__( 'Danger', 'bpq' ).'

  • '. '
'. '
'. '
'. '
'. '
'. '
'. '

'.__( 'Blockquote with source', 'bpq' ).'

'. '
'.__( 'Source', 'bpq' ).'
'. '
'. '
'. '
'. '
'. '

'.__( 'Blockquote reversed', 'bpq' ).'

'. '
'. '
'. '
'. '
'.__( 'Basic, pre-formatted block', 'bpq' ).'
'. '
'. '
'; } /** * Generates a sample panel with headings/body text. * @return string */ function sample_typography() { return '
'. '
'. __( 'Headings and body copy', 'bpq' ). '
'. '
'. sprintf( '

%s %s

', __( 'This is the look for <h1>', 'bpq' ), __( 'and some <small> text within.', 'bpq' ) ). sprintf( '

%s %s

', __( 'This is the look for <h2>', 'bpq' ), __( 'and some <small> text within.', 'bpq' ) ). sprintf( '

%s %s

', __( 'This is the look for <h3>', 'bpq' ), __( 'and some <small> text within.', 'bpq' ) ). sprintf( '

%s %s

', __( 'This is the look for <h4>', 'bpq' ), __( 'and some <small> text within.', 'bpq' ) ). sprintf( '
%s %s
', __( 'This is the look for <h5>', 'bpq' ), __( 'and some <small> text within.', 'bpq' ) ). sprintf( '
%s %s
', __( 'This is the look for <h6>', 'bpq' ), __( 'and some <small> text within.', 'bpq' ) ). sprintf( '

%s %s

', __( 'This is the look for <p> and some filler text follows:', 'bpq' ), \ski\string::lorem() ). sprintf( '

%s

', __( 'This is the look for a link', 'bpq' ) ). '
'. '
'; } /** * Generates a sample panel with wells. * @return string */ function sample_wells() { return '
'. '
'. __( 'Wells', 'bpq' ). '
'. '
'. '
'. '
'. '
'.__( 'Large well', 'bpq' ).'
'. '
'. '
'. '
'.__( 'Well', 'bpq' ).'
'. '
'. '
'. '
'.__( 'Small well', 'bpq' ).'
'. '
'. '
'. '
'. '
'; } /** * Since there are many different kinds of tables and the * markup is complex, this function acts as a shortcut. * * @param string $class * @param string $title * @param integer $rows * @param array $row_classes * @param array $row_titles * @return string */ function tag_table( $class, $title, $rows = 7, $row_classes = array(), $row_titles = array() ) { // Prepare the table. $markup = ''. ''. ''. ''. ''. ''. ''. ''. ''; for( $i = 0; $i < $rows; $i++ ) { $row_class = isset( $row_classes[$i] ) ? $row_classes[$i] : ''; $row_title = isset( $row_titles[$i] ) ? $row_titles[$i] : ( __( 'Row #', 'bpq' ).$i ); $markup .= ''. ''. ''. ''. ''; } $markup .= ''. ''. ''. ''. ''. ''. ''. ''. '
'.$title.''.__( 'C0', 'bpq' ).''.__( 'C1', 'bpq' ).'
'.$row_title.''.__( 'C0R', 'bpq' ).$i.''.__( 'C1R', 'bpq' ).$i.'
'.__( 'Footer', 'bpq' ).''.__( 'T0', 'bpq' ).''.__( 'T1', 'bpq' ).'
'; // Return the table. return $markup; } /** * The markup for a Visual Composer row is a bit involved - * so this function acts as a shortcut. * * @param string $content * @param string $class * @return string */ function tag_stripe( $content, $class = '' ) { return '
'. '
'. '
'. '
'. '
'. $content. '
'. '
'. '
'. '
'. '
'; } ?>