3 more Widgets on Homepage

Community Forums Forums Design Tips and Tricks 3 more Widgets on Homepage

This topic is: not resolved

Tagged: 

This topic contains 15 replies, has 3 voices, and was last updated by  Pinky 1 year, 4 months ago.

Viewing 15 posts - 1 through 15 (of 16 total)
  • Author
    Posts
  • #28955

    lindebjerg
    Participant
    Post count: 42

    I have tried to get 3 Widgets to show up in a row on the Homepage, but they float left?

    here is a screenshot how I would like it to be

    I have setup 3  home featured widget sections. See 3 times “Dekoration” http://dev.buchner-floristik.de/

    Here are all my widgets:

    [php]
    /** Register widget areas */
    genesis_register_sidebar( array(
    ‘id’ => ‘slide’,
    ‘name’ => __( ‘Slide’, ‘mp’ ),
    ‘description’ => __( ‘Soliloquy Slider’, ‘mp’ ),
    ) );
    genesis_register_sidebar( array(
    ‘id’ => ‘angebot’,
    ‘name’ => __( ‘Angebot’, ‘mp’ ),
    ‘description’ => __( ‘Hier ein Angebot’, ‘mp’ ),
    ) );
    genesis_register_sidebar( array(
    ‘id’ => ‘home-featured-1′,
    ‘name’ => __( ‘Home Featured #1′, ‘mp’ ),
    ‘description’ => __( ‘This is the home featured #1 section.’, ‘mp’ ),
    ) );
    genesis_register_sidebar( array(
    ‘id’ => ‘home-featured-2′,
    ‘name’ => __( ‘Home Featured #2′, ‘mp’ ),
    ‘description’ => __( ‘This is the home featured #2 section.’, ‘mp’ ),
    ) );
    genesis_register_sidebar( array(
    ‘id’ => ‘home-featured-3′,
    ‘name’ => __( ‘Home Featured #3′, ‘mp’ ),
    ‘description’ => __( ‘This is the home featured #3 section.’, ‘mp’ ),
    ) );

    genesis_register_sidebar( array(
    ‘id’ => ‘newsletter’,
    ‘name’ => __( ‘Newsletter’, ‘mp’ ),
    ‘description’ => __( ‘Newsletter anmelde Formular’, ‘mp’ ),
    ) );
    genesis_register_sidebar( array(
    ‘id’ => ‘blog’,
    ‘name’ => __( ‘Blog’, ‘mp’ ),
    ‘description’ => __( ‘This is the Blog section.’, ‘mp’ ),
    ) );
    [/php]

    then I have taken CSS style from the Minimum Theme

    [css]
    /* Home Featured
    ———————————————————— */

    #home-featured {
    overflow: hidden;
    padding: 60px 0;
    width: 100%;
    }

    .home-featured-1,
    .home-featured-2,
    .home-featured-3 {
    float: left;
    margin: 0;
    overflow: hidden;
    text-align: center;
    width: 33%;
    }[/css]

    Here my functions.php

    [php]
    ”,
    ‘after’ => ”,
    ) );

    genesis_widget_area( ‘angebot’, array(
    ‘before’ => ”,
    ‘after’ => ”,
    ) );

    genesis_widget_area( ‘home-featured-1′, array(
    ‘before’ => ”,
    ) );

    genesis_widget_area( ‘home-featured-2′, array(
    ‘before’ => ”,
    ) );

    genesis_widget_area( ‘home-featured-3′, array(
    ‘before’ => ”,
    ) );

    genesis_widget_area( ‘newsletter’, array(
    ‘before’ => ”,
    ‘after’ => ”,
    ) );

    genesis_widget_area( ‘blog’, array(
    ‘before’ => ”,
    ‘after’ => ”,
    ) );

    }

    genesis();[/php]

    I dont know how to get this right, where did I make the wrong code, or?

    #28957

    anitac
    Participant
    Post count: 7032

    I think the third widget needs to float right, but did you put any code in your home.php file?


    Let me help you customize your theme, responsive header, Buddypress, Agentpress or technical issue!
    Visit me here: Cre8tiveDiva.com | Tweet Me! | Plus Me!
    When asking for help, please provide a link or screen shot showing your problem!

    #28962

    lindebjerg
    Participant
    Post count: 42

    Yes, here my whole css and home.php
    here I have made the third widget to float right, but still I am missing something?

    [php]<?php
    /**
    * Controls the homepage output.
    */

    add_action( ‘wp_enqueue_scripts’, ‘mp_enqueue_scripts’ );
    /**
    * Enqueue Scripts
    */
    function mp_enqueue_scripts() {

    if ( is_active_sidebar( ‘slide’ ) || is_active_sidebar( ‘angebot’ ) || is_active_sidebar( ‘blog’ ) ) {
    wp_enqueue_script( ‘scrollTo’, get_stylesheet_directory_uri() . ‘/js/jquery.scrollTo.min.js’, array( ‘jquery’ ), ’1.4.5-beta’, true );
    wp_enqueue_script( ‘localScroll’, get_stylesheet_directory_uri() . ‘/js/jquery.localScroll.min.js’, array( ‘scrollTo’ ), ’1.2.8b’, true );
    wp_enqueue_script( ‘scroll’, get_stylesheet_directory_uri() . ‘/js/scroll.js’, array( ‘localScroll’ ), ”, true );
    }
    }

    add_action( ‘genesis_meta’, ‘mp_home_genesis_meta’ );
    /**
    * Add widget support for homepage. If no widgets active, display the default loop.
    *
    */
    function mp_home_genesis_meta() {
    if ( is_active_sidebar( ‘slide’ ) || is_active_sidebar( ‘angebot’ ) || is_active_sidebar( ‘newsletter’ ) || is_active_sidebar( ‘blog’ ) || is_active_sidebar( ‘home-featured-1′ ) || is_active_sidebar( ‘home-featured-2′ ) || is_active_sidebar( ‘home-featured-3′ ) ) {

    // Force content-sidebar layout setting
    add_filter( ‘genesis_pre_get_option_site_layout’, ‘__genesis_return_full_width_content’ );

    // Add mp-home body class
    add_filter( ‘body_class’, ‘mp_body_class’ );
    function mp_body_class( $classes ) {
    $classes[] = ‘mp-home’;
    return $classes;
    }

    // Remove the navigation menus
    remove_action( ‘genesis_after_header’, ‘genesis_do_nav’ );

    // Remove the default Genesis loop
    remove_action( ‘genesis_loop’, ‘genesis_do_loop’ );

    // Add homepage widgets
    add_action( ‘genesis_loop’, ‘mp_homepage_widgets’ );

    }

    }

    function mp_homepage_widgets() {

    genesis_widget_area( ‘slide’, array(
    ‘before’ => ‘<div id="slide"><div class="wrap">’,
    ‘after’ => ‘</div></div>’,
    ) );

    genesis_widget_area( ‘angebot’, array(
    ‘before’ => ‘<div id="angebot"><div class="wrap">’,
    ‘after’ => ‘</div></div>’,
    ) );

    genesis_widget_area( ‘home-featured-1′, array(
    ‘before’ => ‘<div id="home-featured"><div class="wrap">’,
    ) );

    genesis_widget_area( ‘home-featured-2′, array(
    ‘before’ => ‘<div id="home-featured"><div class="wrap">’,
    ) );

    genesis_widget_area( ‘home-featured-3′, array(
    ‘before’ => ‘<div id="home-featured"><div class="wrap">’,
    ) );

    genesis_widget_area( ‘newsletter’, array(
    ‘before’ => ‘<div id="newsletter"><div class="wrap">’,
    ‘after’ => ‘</div></div>’,
    ) );

    genesis_widget_area( ‘blog’, array(
    ‘before’ => ‘<div id="blog"><div class="wrap">’,
    ‘after’ => ‘</div></div>’,
    ) );

    }

    genesis();[/php]

    [css]
    /*
    Theme Name: Modern Portfolio Child Theme
    Theme URI: http://my.studiopress.com/themes/modern-portfolio/
    Description: Minimialist, mobile-responsive theme created for the Genesis Framework.
    Author: StudioPress
    Author URI: http://www.studiopress.com/

    Version: 1.0.1

    Tags: black, white, one-column, two-columns, fixed-width, custom-menu, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready

    Template: genesis
    Template Version: 1.9

    License: GPL-2.0+
    License URI: http://www.opensource.org/licenses/gpl-license.php
    */

    /* Table of Contents

    01 Import Fonts
    02 Defaults
    03 Typography
    - Font Color
    - Font Family
    - Font Size
    - Font Miscellaneous
    04 Layout
    - Structure
    - 1080px CSS Grid
    - Header
    - Homepage
    - Main Content
    - Post Info & Meta
    - Column Classes
    - Miscellaneous
    05 Menus
    - Primary Navigation Extras
    06 Headings
    07 Lists
    08 Post Navigation
    09 Comments
    10 Sidebars
    11 Footer
    - Footer Widgets
    12 Forms & Buttons
    - Gravity Forms
    13 Images & Captions
    13.1 Extras Lindebjerg
    14 Media Queries
    - max-width: 1024px
    - max-width: 768px
    - max-width: 480px

    */

    /*
    01 Import Fonts
    —————————————————————————————————- */

    @import url(http://fonts.googleapis.com/css?family=Lato:300,400|Merriweather:300,400);

    /*
    02 Defaults
    —————————————————————————————————- */

    html, body, div, span, applet, object, iframe,
    h1, h2, h3, h4, h5, h6, p, blockquote, pre,
    a, abbr, acronym, address, big, cite, code,
    del, dfn, em, img, ins, kbd, q, s, samp,
    small, strike, strong, sub, sup, tt, var,
    b, u, i, center,
    dl, dt, dd, ol, ul, li,
    fieldset, form, label, legend,
    table, caption, tbody, tfoot, thead, tr, th, td,
    article, aside, canvas, details, embed,
    figure, figcaption, footer, header, hgroup,
    input, menu, nav, output, ruby, section, summary,
    time, mark, audio, video {
    border: 0;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
    }

    html {
    font-size: 100%; /* 16px browser default */
    }

    body {
    background-color: #fff;
    line-height: 1;
    }

    body,
    input,
    select,
    textarea,
    .footer-widgets-1,
    .footer-widgets-2,
    .footer-widgets-3,
    #home-featured .wrap,
    #slide .wrap,
    #blog .wrap,
    #footer-widgets,
    #inner,
    #angebot .wrap,
    #newsletter .wrap {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    }

    a,
    a:visited,
    button,
    input[type="button"],
    input[type="submit"],
    .btn,
    #home-featured img,
    #blog img,
    #angebot img {
    -moz-transition: all 0.1s ease-in-out;
    -webkit-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
    }

    ::-moz-selection {
    background-color: #222;
    color: #fff;
    }

    ::selection {
    background-color: #222;
    color: #fff;
    }

    a img {
    border: none;
    }

    /*
    03 Typography
    ——————————————————————————————————-

    This section covers font colors, families, size, styles and weight.

    This style sheet uses rem values with a pixel fallback.
    The rem values are calculated per the examples below:

    12 / 16 = 0.75rem
    14 / 16 = 0.875rem
    16 / 16 = 1rem
    18 / 16 = 1.125rem
    20 / 16 = 1.25rem
    24 / 16 = 1.5rem
    30 / 16 = 1.875rem
    36 / 16 = 2.25rem
    42 / 16 = 2.625rem
    48 / 16 = 3rem

    Further reading on the use and compatibility of rems:

    http://caniuse.com/rem

    http://snook.ca/archives/html_and_css/font-size-with-rem

    */

    /* 03a – Font Color ———– */

    a:hover,
    body,
    h2 a,
    h2 a:visited,
    h4.widgettitle a,
    input,
    .genesis-nav-menu a,
    .genesis-nav-menu a:visited,
    .genesis-nav-menu li li a,
    .genesis-nav-menu li li a:link,
    .genesis-nav-menu li li a:visited,
    .post-comments,
    .post-info a,
    .post-meta a,
    #footer a,
    #title a,
    #title a:hover {
    color: #222;
    }

    a,
    h2 a:hover,
    .genesis-nav-menu li.right a:hover,
    .post-info a:hover,
    .post-meta a:hover,
    #footer a:hover,
    #header .genesis-nav-menu li a:hover {
    color: #cb1024;
    }

    blockquote::before,
    blockquote p,
    input,
    select,
    textarea,
    .post-info,
    .post-meta {
    color: #888;
    }

    .footer-widgets a {
    color: #aaa;
    }

    a.cta-button,
    a.landing-button,
    a.social-buttons,
    button,
    input[type="button"],
    input[type="submit"],
    .btn,
    .enews,
    .footer-widgets,
    .footer-widgets a:hover,
    .genesis-nav-menu li a:hover,
    .genesis-nav-menu li li a:hover,
    .genesis-nav-menu .highlight-menu-item a,
    .genesis-nav-menu .highlight-menu-item a:hover,
    .navigation li a,
    .navigation li a:hover,
    .navigation li.active a,
    .navigation li.disabled,
    #slide,
    #newsletter {
    color: #fff;
    }

    a.cta-button:hover,
    a.social-buttons:hover,
    .sidebar .enews-widget input:hover[type="submit"] {
    color: #222;
    }

    /* 03b – Font Family ———– */

    body,
    input,
    textarea,
    .author-box h1,
    #title {
    font-family: ‘Lato’, sans-serif;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    .entry-title a,
    #title a::before {
    font-family: ‘Merriweather’, serif;
    }

    /* 03c – Font Size ———– */

    h1,
    .entry-title,
    .entry-title a {
    font-size: 36px;
    font-size: 2.25rem;
    }

    blockquote::before {
    font-size: 32px;
    font-size: 2rem;
    }

    h2 {
    font-size: 30px;
    font-size: 1.875rem;
    }

    h3,
    h4,
    .archive-title,
    .taxonomy-description h1,
    .widgettitle,
    #title {
    font-size: 24px;
    font-size: 1.5rem;
    }

    h5,
    h6,
    .archive-title,
    .author-box h1,
    .footer-widgets .widgettitle,
    .sidebar h2 a,
    .taxonomy-description h1,
    #slide,
    #blog,
    #newsletter {
    font-size: 20px;
    font-size: 1.25rem;
    }

    body,
    .featuredpost h2 a {
    font-size: 18px;
    font-size: 1.125rem;
    }

    input,
    select,
    textarea,
    .comment-header,
    .featuredpost p,
    .post-info,
    .post-meta,
    .wp-caption {
    font-size: 16px;
    font-size: 1rem;
    }

    a.social-buttons {
    font-size: 14px;
    font-size: 0.875rem;
    }

    /* 03d – Font Miscellaneous ———– */

    cite {
    font-style: normal;
    }

    body,
    input,
    #title {
    font-weight: 300;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    strong,
    .wp-caption {
    font-weight: 400;
    }

    a.landing-button,
    .wp-caption {
    text-align: center;
    }

    a.cta-button,
    a.landing-button,
    a.social-buttons,
    h2 a,
    h2 a:visited,
    .genesis-nav-menu a,
    .navigation li a,
    .widgettitle a,
    #title a {
    text-decoration: none;
    }

    #title {
    text-transform: lowercase;
    }

    #title a::before {
    text-transform: uppercase;
    }

    /*
    04 Layout
    —————————————————————————————————- */

    /* 04a – Structure ———– */

    .wrap,
    #header,
    #inner {
    margin: 0 auto;
    max-width: 1080px;
    }

    .mp-landing #inner {
    border: 1px solid #222;
    max-width: 700px;
    margin: 32px auto;
    margin: 2rem auto;
    padding: 48px 64px 0;
    padding: 3rem 4rem 0;
    }

    #inner {
    clear: both;
    overflow: hidden;
    padding: 64px 0 16px;
    padding: 4rem 0 1rem;
    }

    .mp-home #inner {
    padding: 0;
    max-width: 100%;
    }

    /* 04b – 1080px CSS Grid ———– */

    .footer-widgets-1,
    .footer-widgets-2,
    .footer-widgets-3,
    .sidebar,
    #blog .featuredpost .post:nth-of-type(3n+0),
    #blog .featuredpost .post:nth-of-type(3n+1),
    #blog .featuredpost .post:nth-of-type(3n+2),
    #home-featured .featuredpost .post:nth-of-type(3n+0),
    #home-featured .featuredpost .post:nth-of-type(3n+1),
    #home-featured .featuredpost .post:nth-of-type(3n+2),
    #angebot .featuredpost .post:nth-of-type(3n+0),
    #angebot .featuredpost .post:nth-of-type(3n+1),
    #angebot .featuredpost .post:nth-of-type(3n+2),
    #newsletter .alignright,
    #title-area {
    width: 29.629629629%; /* 320px / 1080px */
    }

    #content,
    #header .widget-area,
    #newsletter .alignleft {
    width: 64.814814814%; /* 700px / 1080px */
    }

    .full-width-content #content,
    #content-sidebar-wrap {
    width: 100%; /* 1080px / 1080px */
    }

    .footer-widgets-1,
    .footer-widgets-2,
    .sidebar-content #sidebar,
    #blog .featuredpost .post:nth-of-type(3n+1),
    #blog .featuredpost .post:nth-of-type(3n+2),
    #content,
    #content-sidebar-wrap,
    #footer .gototop,
    #home-featured .home-featured-1,
    #home-featured .home-featured-2,
    #angebot .featuredpost .post:nth-of-type(3n+1),
    #angebot .featuredpost .post:nth-of-type(3n+2),
    #sidebar-alt,
    #title-area {
    float: left;
    }

    .footer-widgets-3,
    .sidebar,
    .sidebar-content #content,
    #blog .featuredpost .post:nth-of-type(3n+0),
    #footer .creds,
    #header .widget-area,
    #home-featured .home-featured-3,
    #angebot .featuredpost .post:nth-of-type(3n+0) {
    float: right;
    }

    .footer-widgets-1,
    #blog .featuredpost .post:nth-of-type(3n+1),
    #home-featured .home-featured-1,
    #angebot .featuredpost .post:nth-of-type(3n+1) {
    margin-right: 5.555555555%; /* 60px / 1080px */
    }

    /* 04c – Header ———– */

    #header {
    border-bottom: 1px solid #222;
    overflow: hidden;
    padding: 32px 0;
    padding: 2rem 0;
    }

    .mp-home #header {
    border: none;
    }

    #title-area {
    padding: 12px 0;
    padding: 0.75rem 0;
    }

    .header-image #header,
    .header-image #title-area {
    padding: 0;
    }

    #title,
    #title a {
    cursor: pointer;
    display: block;
    line-height: 1;
    margin: 0;
    }

    #title a::before {
    background-color: #222;
    border-radius: 50%;
    color: #fff;
    content: "M"; /* Used to display the letter in the header logo */
    cursor: pointer;
    display: inline-block;
    height: 58px;
    line-height: 2.5;
    margin-right: 16px;
    margin-right: 1rem;
    padding: 3px 4px;
    padding: 0.1875rem 0.25rem;
    text-align: center;
    width: 58px;
    }

    #title a:hover::before {
    background-color: #cb1024;
    }

    .header-full-width #title,
    .header-full-width #title a,
    .header-full-width #title-area {
    width: 100%;
    }

    .header-image #title,
    .header-image #title a,
    .header-image #title-area {
    display: block;
    float: left;
    min-height: 120px;
    overflow: hidden;
    text-indent: -9999px;
    }

    .header-image #title,
    .header-image #title a {
    width: 100%;
    }

    /* Home Featured
    ———————————————————— */

    #home-featured {
    overflow: hidden;
    padding: 60px 0;
    width: 100%;
    }

    .home-featured-1,
    .home-featured-2,
    .home-featured-3 {
    float: left;
    margin: 0;
    overflow: hidden;
    text-align: center;
    width: 33%;
    }

    /* 04d – Homepage ———– */

    #slide,
    #blog,
    #angebot,
    #home-featured,
    #newsletter {
    clear: both;
    overflow: hidden;
    }

    #slide {
    background-color: #E0E05A;
    }

    #newsletter {
    background-color: #F7C41F;
    }

    #slide,
    #newsletter {
    padding: 64px 0;
    padding: 4rem 0;
    }

    #blog,
    #angebot,
    #home-featured {
    padding: 64px 0 16px;
    padding: 4rem 0 1rem;
    }

    /* 04e – Main Content ———– */

    #content {
    padding-bottom: 48px;
    padding-bottom: 3rem;
    }

    .mp-home #content {
    padding: 0;
    }

    .entry,
    .page .post.entry {
    margin-bottom: 80px;
    margin-bottom: 5rem;
    }

    .mp-home .featuredpost .entry,
    .single .entry {
    margin-bottom: 48px;
    margin-bottom: 3rem;
    }

    .page .entry {
    margin: 0;
    }

    .entry-content {
    overflow: hidden;
    }

    .featuredpost .entry p {
    line-height: 1.5;
    }

    .entry-content,
    .entry-content p,
    #slide,
    #newsletter {
    line-height: 1.625;
    }

    .entry-content p {
    margin-bottom: 26px;
    margin-bottom: 1.625rem;
    }

    blockquote {
    padding: 24px 64px;
    padding: 1.5rem 4rem;
    }

    blockquote::before {
    content: "“";
    display: block;
    height: 0;
    left: -20px;
    position: relative;
    top: -10px;
    }

    /* 04f – Post Info & Meta ———– */

    .post-info,
    .post-meta {
    clear: both;
    line-height: 1.5;
    }

    .post-info {
    margin-bottom: 24px;
    margin-bottom: 1.5rem;
    }

    .post-comments {
    background: url(images/post-comments.png) no-repeat center left;
    margin-left: 16px;
    margin-left: 1rem;
    padding-left: 20px;
    padding-left: 1.25rem;
    }

    .post-meta::before {
    border-top: 1px solid #222;
    content: "";
    display: block;
    padding-bottom: 32px;
    padding-bottom: 2rem;
    width: 10%;
    }

    .categories,
    .tags {
    display: block;
    }

    /* 04g – Column Classes ———– */

    .five-sixths,
    .four-fifths,
    .four-sixths,
    .one-fifth,
    .one-fourth,
    .one-half,
    .one-sixth,
    .one-third,
    .three-fifths,
    .three-fourths,
    .three-sixths,
    .two-fifths,
    .two-fourths,
    .two-sixths,
    .two-thirds {
    float: left;
    margin-left: 4.166666666%; /* 48px / 1152px */
    }

    .one-half,
    .three-sixths,
    .two-fourths {
    width: 47.9166666666%; /* 552px / 1152px */
    }

    .one-third,
    .two-sixths {
    width: 30.555555555%; /* 352px / 1152px */
    }

    .four-sixths,
    .two-thirds {
    width: 65.277777777%; /* 752px / 1152px */
    }

    .one-fourth {
    width: 21.875%; /* 252px / 1152px */
    }

    .three-fourths {
    width: 73.958333333%; /* 852px / 1152px */
    }

    .one-fifth {
    width: 16.666666666%; /* 192px / 1152px */
    }

    .two-fifths {
    width: 37.5%; /* 432px / 1152px */
    }

    .three-fifths {
    width: 58.333333333%; /* 672px / 1152px */
    }

    .four-fifths {
    width: 79.166666666%; /* 912px / 1152px */
    }

    .one-sixth {
    width: 13.194444444%; /* 152px / 1152px */
    }

    .five-sixths {
    width: 82.638888888%; /* 952px / 1152px */
    }

    .first {
    margin-left: 0;
    }

    /* 04h – Miscellaneous ———– */

    a.social-buttons {
    background-color: #888;
    float: left;
    margin: 0 4px 4px 0;
    margin: 0 0.25rem 0.25rem 0;
    overflow: hidden;
    padding: 4px 8px;
    padding: 0.25rem 0.5rem;
    }

    a.social-buttons:hover {
    background-color: #fff;
    }

    p.subscribe-to-comments {
    padding: 24px 0 16px;
    padding: 1.5rem 0 1rem;
    }

    p.pages,
    .clear,
    .clear-line,
    .first {
    clear: both;
    }

    .clear-line {
    border-bottom: 1px solid #222;
    margin-bottom: 26px;
    margin-bottom: 1.625rem;
    }

    .alignleft,
    .archive-page {
    float: left;
    }

    .alignright {
    float: right;
    }

    .archive-page {
    width: 50%;
    }

    .author-box,
    .sticky {
    margin-bottom: 80px;
    margin-bottom: 5rem;
    }

    .author-box,
    .author-box h1,
    .taxonomy-description {
    line-height: 1.5;
    }

    .author-box,
    .sticky,
    .taxonomy-description {
    background-color: #f5f5f5;
    margin-bottom: 48px;
    margin-bottom: 3rem;
    overflow: hidden;
    padding: 32px;
    padding: 2rem;
    }

    #angebot .sticky {
    background: none;
    margin: 0;
    padding: 0;
    }

    .breadcrumb {
    border-bottom: 1px solid #222;
    margin-bottom: 48px;
    margin-bottom: 3rem;
    overflow: hidden;
    padding: 8px 0 24px;
    padding: 0.5rem 0 1.5rem;
    }

    /*
    05 Menus
    —————————————————————————————————- */

    .genesis-nav-menu {
    clear: both;
    overflow: hidden;
    }

    #header .genesis-nav-menu {
    float: right;
    margin-top: 10px;
    margin-top: 0.625rem;
    width: auto;
    }

    .genesis-nav-menu.menu-primary,
    .genesis-nav-menu.menu-secondary {
    border-bottom: 1px solid #222;
    }

    .genesis-nav-menu ul {
    float: left;
    width: 100%;
    }

    .genesis-nav-menu li {
    display: inline-block;
    float: left;
    list-style-type: none;
    text-align: left;
    }

    .genesis-nav-menu a {
    display: block;
    padding: 24px 20px;
    padding: 1.5rem 1.25rem;
    position: relative;
    }

    .genesis-nav-menu li.highlight-menu-item {
    margin-left: 20px;
    margin-left: 1.25rem;
    }

    .genesis-nav-menu .highlight-menu-item a {
    background-color: #222;
    }

    .genesis-nav-menu .highlight-menu-item a:hover {
    background-color: #cb1024;
    }

    .genesis-nav-menu li li a,
    .genesis-nav-menu li li a:link,
    .genesis-nav-menu li li a:visited {
    background-color: #fff;
    border: 1px solid #222;
    border-top: none;
    padding: 20px;
    padding: 1.25rem;
    position: relative;
    width: 160px;
    }

    .genesis-nav-menu li a:hover,
    .genesis-nav-menu li li a:hover {
    background-color: #222;
    }

    #header .genesis-nav-menu li a:hover {
    background: none;
    }

    .genesis-nav-menu li ul {
    left: -9999px;
    position: absolute;
    width: 202px;
    z-index: 99;
    }

    .genesis-nav-menu li ul ul {
    margin: -59px 0 0 201px;
    }

    .genesis-nav-menu li:hover ul ul,
    .genesis-nav-menu li.sfHover ul ul {
    left: -9999px;
    }

    .genesis-nav-menu li:hover,
    .genesis-nav-menu li.sfHover {
    position: static;
    }

    ul.genesis-nav-menu li:hover>ul,
    ul.genesis-nav-menu li.sfHover ul,
    #header .genesis-nav-menu li:hover>ul,
    #header .genesis-nav-menu li.sfHover ul {
    left: auto;
    }

    .genesis-nav-menu li a .sf-sub-indicator,
    .genesis-nav-menu li li a .sf-sub-indicator,
    .genesis-nav-menu li li li a .sf-sub-indicator {
    position: absolute;
    text-indent: -9999px;
    }

    #wpadminbar li:hover ul ul {
    left: 0;
    }

    /* 05a – Primary Navigation Extras ———– */

    .genesis-nav-menu li.right {
    float: right;
    padding: 24px 20px;
    padding: 1.5rem 1.25rem;
    }

    .genesis-nav-menu li.right a {
    display: inline;
    padding: 0;
    }

    .genesis-nav-menu li.search {
    padding: 6px 0 0;
    padding: 0.375rem 0 0;
    }

    .genesis-nav-menu li.rss a {
    background: url(images/rss.png) no-repeat center left;
    margin-left: 20px;
    margin-left: 1.25rem;
    padding-left: 20px;
    padding-left: 1.25rem;
    }

    .genesis-nav-menu li.twitter a {
    background: url(images/twitter-nav.png) no-repeat center left;
    padding-left: 24px;
    padding-left: 1.5rem;
    }

    /*
    06 Headings
    —————————————————————————————————- */

    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    .entry-title a {
    line-height: 1.2;
    margin-bottom: 16px;
    margin-bottom: 1rem;
    }

    .author-box h1 {
    margin: 0
    }

    .taxonomy-description h1 {
    margin-bottom: 4px;
    margin-bottom: 0.25rem;
    }

    .featuredpost h2 {
    margin-bottom: 8px;
    margin-bottom: 0.5rem;
    }

    .archive-title,
    #blog .widgettitle,
    #angebot .widgettitle,
    #home-featured .widgettitle {
    margin-bottom: 24px;
    margin-bottom: 1.5rem;
    }

    /*
    07 Lists
    —————————————————————————————————- */

    .entry-content ol,
    .entry-content ul {
    margin-bottom: 26px;
    margin-bottom: 1.625rem;
    }

    .entry-content ol li,
    .entry-content ul li {
    line-height: 1.625;
    }

    .entry-content ol li,
    .entry-content ul li {
    margin-left: 40px;
    margin-left: 2.5rem;
    }

    .entry-content ol li {
    list-style-type: decimal;
    }

    .entry-content ul li {
    list-style-type: disc;
    }

    .entry-content ol ol,
    .entry-content ul ul {
    margin-bottom: 0;
    }

    /*
    08 Post Navigation
    —————————————————————————————————- */

    .navigation li {
    display: inline;
    }

    .navigation li a,
    .navigation li a:hover,
    .navigation li.active a,
    .navigation li.disabled {
    background-color: #222;
    border-radius: 3px;
    cursor: pointer;
    padding: 12px;
    padding: 0.75rem;
    }

    .navigation li a:hover,
    .navigation li.active a {
    background-color: #cb1024;
    }

    /*
    09 Comments
    —————————————————————————————————- */

    #comments,
    #respond {
    line-height: 1.5;
    overflow: hidden;
    }

    .ping-list,
    #comments {
    margin-bottom: 48px;
    margin-bottom: 3rem;
    }

    #author,
    #email,
    #url {
    width: 50%;
    }

    .commentmetadata,
    #author,
    #email,
    #url {
    margin-bottom: 12px;
    margin-bottom: 0.75rem;
    }

    #comment {
    margin: 12px 0;
    margin: 0.75rem 0;
    }

    label {
    margin-left: 12px;
    margin-left: 0.75rem;
    }

    .comment-list li,
    .ping-list li {
    list-style-type: none;
    margin-top: 24px;
    margin-top: 1.5rem;
    padding: 32px;
    padding: 2rem;
    }

    .comment-list li ul li {
    margin-right: -32px;
    margin-right: -2rem;
    }

    .comment-header {
    overflow: hidden;
    }

    .comment {
    background-color: #f5f5f5;
    border: 2px solid #fff;
    border-right: none;
    }

    .comment-content p {
    margin-bottom: 24px;
    margin-bottom: 1.5rem;
    }

    .bypostauthor {
    }

    #comments .navigation {
    margin-top: 32px;
    margin-top: 2rem;
    }

    /*
    10 Sidebars
    —————————————————————————————————- */

    .sidebar {
    display: inline;
    line-height: 1.5;
    padding-top: 8px;
    padding-top: 0.5rem;
    }

    .sidebar p {
    margin-bottom: 16px;
    margin-bottom: 1rem;
    }

    .sidebar .widget {
    margin-bottom: 32px;
    margin-bottom: 2rem;
    overflow: hidden;
    }

    .sidebar .widget::after {
    border-bottom: 1px solid #222;
    content: "";
    display: block;
    padding-bottom: 32px;
    padding-bottom: 2rem;
    width: 20%;
    }

    .sidebar.widget-area ul li {
    list-style-type: none;
    margin-bottom: 6px;
    margin-bottom: 0.375rem;
    word-wrap: break-word;
    }

    .enews {
    background-color: #222;
    margin-bottom: 8px;
    margin-bottom: 0.75rem;
    padding: 32px;
    padding: 2rem;
    }

    .sidebar .widget.enews-widget::after {
    border-bottom: none;
    padding-bottom: 0;
    }

    /*
    11 Footer
    —————————————————————————————————- */

    #footer {
    border-top: 1px solid #222;
    clear: both;
    overflow: hidden;
    padding: 48px 0;
    padding: 3rem 0;
    }

    #footer .creds {
    text-align: right;
    }

    #footer .creds,
    #footer .gototop {
    margin: 16px 0;
    margin: 1rem 0;
    }

    /* 11a – Footer Widgets ———– */

    .footer-widgets {
    background-color: #222;
    clear: both;
    line-height: 1.5;
    overflow: hidden;
    padding: 64px 0 16px;
    padding: 4rem 0 1rem;
    }

    .footer-widgets p {
    margin-bottom: 16px;
    margin-bottom: 1rem;
    }

    .footer-widgets .widget {
    margin-bottom: 32px;
    margin-bottom: 2rem;
    overflow: hidden;
    }

    .footer-widgets .widget-area ul li {
    list-style-type: none;
    margin-bottom: 6px;
    margin-bottom: 0.375rem;
    word-wrap: break-word;
    }

    /*
    12 Forms & Buttons
    —————————————————————————————————- */

    input,
    select,
    textarea {
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 3px;
    box-shadow: 0 0 5px #ddd inset;
    padding: 16px;
    padding: 1rem;
    width: 100%;
    }

    #header .search-form {
    float: right;
    margin-top: 56px;
    margin-top: 3.5rem;
    width: 100%;
    }

    .sidebar .enews-widget input {
    background-color: #fff;
    box-shadow: none;
    }

    a.cta-button,
    a.landing-button,
    button,
    input[type="button"],
    input[type="submit"],
    .btn {
    background-color: #222;
    border: none;
    box-shadow: none;
    cursor: pointer;
    padding: 16px 24px;
    padding: 1rem 1.5rem;
    width: auto;
    }

    a.cta-button {
    float: right;
    margin-top: -32px;
    margin-top: -2rem;
    padding: 20px 24px;
    padding: 1.25rem 1.5rem;
    }

    a.landing-button {
    margin-top: 16px;
    margin-top: 1rem;
    }

    a.cta-button,
    a.landing-button:hover,
    button:hover,
    input:hover[type="button"],
    input:hover[type="submit"],
    .btn:hover,
    .sidebar .enews-widget input[type="submit"] {
    background-color: #cb1024;
    }

    .sidebar .enews-widget input {
    margin-bottom: 8px;
    margin-bottom: 0.75rem;
    }

    .sidebar .enews-widget input[type="submit"] {
    display: block;
    margin: 0 auto;
    padding: 16px;
    padding: 1rem;
    width: 100%;
    }

    a.cta-button:hover,
    .sidebar .enews-widget input:hover[type="submit"] {
    background-color: #fff;
    }

    .search-form input[type="submit"] {
    border: 0;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    }

    /* 12a – Gravity Forms ———– */

    #content div.gform_wrapper input,
    #content div.gform_wrapper select,
    #content div.gform_wrapper textarea,
    #content div.gform_wrapper .ginput_complex label {
    font-size: 16px;
    font-size: 1rem;
    padding: 16px;
    padding: 1rem;
    }

    #content div.gform_wrapper input[type="submit"] {
    padding: 16px 24px;
    padding: 1rem 1.5rem;
    }

    #content div.gform_wrapper .ginput_complex label {
    padding: 0;
    }

    div.gform_wrapper li,
    div.gform_wrapper form li {
    margin: 16px 0 0;
    margin: 1rem 0 0;
    }

    /*
    13 Images & Captions
    —————————————————————————————————- */

    embed,
    img,
    object,
    video,
    .wp-caption {
    max-width: 100%;
    }

    img {
    height: auto;
    }

    #blog img,
    #angebot img,
    #home-featured img {
    margin-bottom: 24px;
    margin-bottom: 1.5rem;
    opacity: 0.8;
    }

    #blog img:hover,
    #angebot img:hover,
    home-featured img:hover{
    opacity: 1;
    }

    .alignleft .avatar {
    margin-right: 24px;
    margin-right: 1.5rem;
    }

    .alignright .avatar {
    margin-left: 24px;
    margin-left: 1.5rem;
    }

    .author-box .avatar {
    float: left;
    margin-right: 24px;
    margin-right: 1.5rem
    }

    .comment-list li .avatar {
    float: left;
    margin: 0 16px 24px 0;
    margin: 0 1rem 1.5rem 0;
    }

    img.centered,
    .aligncenter {
    display: block;
    margin: 0 auto 24px;
    margin: 0 auto 1.5rem
    }

    img.alignnone {
    display: inline;
    margin-bottom: 12px;
    margin-bottom: 0.75rem;
    }

    img.alignleft,
    .post-image,
    .wp-caption.alignleft {
    display: inline;
    margin: 0 24px 24px 0;
    margin: 0 1.5rem 1.5rem 0;
    }

    img.alignright,
    .wp-caption.alignright {
    display: inline;
    margin: 0 0 24px 24px;
    margin: 0 0 1.5rem 1.5rem;
    }

    p.wp-caption-text {
    line-height: 1.2;
    margin-top: 12px;
    margin-top: 0.75rem;
    }

    .gallery-caption {
    }

    /*
    13.1 Extras Lindebjerg
    —————————————————————————————————- */
    #header .menu li.home a {
    background: url(images/home.png)!important;
    margin-top: 18px;
    height: 55px;
    padding: 0;
    text-indent: -9999px;
    width: 55px;
    }

    #header .menu li.home a:active,
    #header .menu li.home a:hover {
    background: url(images/home-2.png)!important;
    margin-top: 18px;
    height: 55px;
    padding: 0;
    text-indent: -9999px;
    width: 55px;
    }

    /*
    14 Media Queries
    —————————————————————————————————- */

    /* Desktops, laptops and iPads (landscape) ———– */

    @media only screen and (max-width: 1024px) {

    .wrap,
    #inner {
    max-width: 960px;
    }

    }

    /* iPads (portrait) ———– */

    @media only screen and (max-width: 768px) {
    #home-featured {
    padding: 30px 0 0;
    }

    .home-featured-1,
    .home-featured-2,
    .home-featured-3 {
    padding: 0 0 30px;
    width: 100%;
    }

    #inner {
    padding: 32px 5%;
    padding: 2rem 5%;
    }

    .footer-widgets {
    padding: 64px 5% 32px;
    padding: 4rem 5% 2rem;
    }

    #slide .wrap,
    #blog .wrap,
    #angebot .wrap,
    #newsletter .wrap,
    #img:hover .wrap {
    padding: 0 5%;
    }

    .footer-widgets-1,
    .footer-widgets-2,
    .footer-widgets-3,
    .wrap,
    #footer .creds,
    #footer .gototop,
    #header .widget-area,
    #inner,
    #newsletter .alignleft,
    #newsletter .alignright,
    #title-area,
    #wrap .sidebar,
    #wrap #content,
    #wrap #content-sidebar-wrap,
    #wrap #sidebar-alt {
    width: 100% !important;
    }

    .genesis-nav-menu li,
    #footer .creds,
    #footer .gototop,
    #header ul.genesis-nav-menu,
    #header .search-form {
    float: none;
    }

    .genesis-nav-menu,
    #footer .creds,
    #footer .gototop,
    #header .search-form,
    #title,
    #title-area {
    text-align: center;
    }

    #header {
    padding: 0;
    }

    #title-area {
    padding: 12px 0 0;
    padding: 0.75rem 0 0;
    }

    #title {
    margin: 16px 0;
    margin: 1rem 0;
    }

    #header .search-form {
    margin: 32px auto 0;
    margin: 2rem auto 0;
    width: 50%;
    }

    .genesis-nav-menu a {
    padding: 20px 16px;
    padding: 1.25rem 1rem;
    }

    .genesis-nav-menu li.right {
    display: none;
    }

    .mp-landing #inner {
    border: none;
    }

    a.cta-button {
    float: none;
    line-height: 6;
    }

    #footer {
    padding: 24px 0;
    padding: 1.5rem 0;
    }

    .footer-widgets-1,
    #header .genesis-nav-menu {
    margin: 0;
    }

    }

    /* iPhones (portrait and landscape) ———– */

    @media only screen and (max-width: 480px) {

    html {
    font-size: 87.5%; /* 14px base */
    }

    #title a::before {
    height: 50px;
    width: 50px;
    }

    #blog .featuredpost .post:nth-of-type(3n+0),
    #blog .featuredpost .post:nth-of-type(3n+1),
    #blog .featuredpost .post:nth-of-type(3n+2),
    #angebot .featuredpost .post:nth-of-type(3n+0),
    #angebot .featuredpost .post:nth-of-type(3n+1),
    #angebot .featuredpost .post:nth-of-type(3n+2),
    #header .search-form {
    width: 100%;
    }

    .archive-page,
    .five-sixths,
    .four-fifths,
    .four-sixths,
    .one-fifth,
    .one-fourth,
    .one-half,
    .one-sixth,
    .one-third,
    .three-fifths,
    .three-fourths,
    .three-sixths,
    .two-fifths,
    .two-fourths,
    .two-sixths,
    .two-thirds {
    margin: 0;
    width: 100%;
    }

    }
    @media only screen and (max-width: 300px) {

    .home-featured-1,
    .home-featured-2,
    .home-featured-3 {
    padding: 0 0 30px;
    width: 100%;
    }

    }[/css]

    #28964

    anitac
    Participant
    Post count: 7032

    In your Home.php – you have each widget in a separate DIV. I believe they all need to be in one DIV, floating 1, 2 – left and 3 right.


    Let me help you customize your theme, responsive header, Buddypress, Agentpress or technical issue!
    Visit me here: Cre8tiveDiva.com | Tweet Me! | Plus Me!
    When asking for help, please provide a link or screen shot showing your problem!

    #28965

    lindebjerg
    Participant
    Post count: 42

    okay, ? but how then…. I have no idear how to wrap it together that it works, it just break or show nothing when I try to make it different.

    #28967

    anitac
    Participant
    Post count: 7032

    I just sent out a Tweet to see if I can get someone more experienced to help with that. Give it a little time, someone will respond.


    Let me help you customize your theme, responsive header, Buddypress, Agentpress or technical issue!
    Visit me here: Cre8tiveDiva.com | Tweet Me! | Plus Me!
    When asking for help, please provide a link or screen shot showing your problem!

    #28969

    lindebjerg
    Participant
    Post count: 42

    thanks anitac, I hope you reach someone:)

    #28972

    Pinky
    Participant
    Post count: 95

    Hi there

    functions.php looks fine to me.

    You just need to call the functions into the home.php

    On the home page replace this:

    [php]
    genesis_widget_area( ‘home-featured-1′, array(
    ‘before’ => ‘<div id="home-featured"><div class="wrap">’,
    ) );

    genesis_widget_area( ‘home-featured-2′, array(
    ‘before’ => ‘<div id="home-featured"><div class="wrap">’,
    ) );

    genesis_widget_area( ‘home-featured-3′, array(
    ‘before’ => ‘<div id="home-featured"><div class="wrap">’,
    ) );

    genesis_widget_area( ‘newsletter’, array(
    ‘before’ => ‘<div id="newsletter"><div class="wrap">’,
    ‘after’ => ‘</div></div>’,
    ) );

    genesis_widget_area( ‘blog’, array(
    ‘before’ => ‘<div id="blog"><div class="wrap">’,
    ‘after’ => ‘</div></div>’,
    ) );

    [/php]

    with this :

    [php]
    echo ‘<div id="home-featured"><div class="wrap">’;

    genesis_widget_area( ‘home-featured-1′, array(
    ‘before’ => ‘<div class="home-featured-1 widget-area">’,
    ) );

    genesis_widget_area( ‘home-featured-2′, array(
    ‘before’ => ‘<div class="home-featured-2 widget-area">’,
    ) );

    genesis_widget_area( ‘home-featured-3′, array(
    ‘before’ => ‘<div class="home-featured-3 widget-area">’,
    ) );

    echo ‘</div><!– end .wrap –></div><!– end #home-featured –>’;
    [/php]

    The css should be ok as it is but if it gives you problems once you’ve done all of the above, then try this:

    [css]
    /* Home Featured
    ———————————————————— */

    #home-featured {
    overflow: hidden;
    padding: 60px 0;
    width: 100%;
    }

    .home-featured-1,
    .home-featured-2 {
    float: left;
    margin: 0;
    overflow: hidden;
    text-align: center;
    width: 33%;
    }

    .home-featured-3 {
    float: right;
    margin: 0;
    overflow: hidden;
    text-align: center;
    width: 33%;
    }
    [/css]


    cheers

    Pinky

    #28974

    anitac
    Participant
    Post count: 7032

    @pinky thanks! I can rationalize what needs to be done, but can’t code it!


    Let me help you customize your theme, responsive header, Buddypress, Agentpress or technical issue!
    Visit me here: Cre8tiveDiva.com | Tweet Me! | Plus Me!
    When asking for help, please provide a link or screen shot showing your problem!

    #28986

    Pinky
    Participant
    Post count: 95

    lol… @ anita I actually didn’t realise I’m such a nerd until I started answering some of these questions!

    hehe – you sure can design tho!


    cheers

    Pinky

    #28989

    anitac
    Participant
    Post count: 7032

    I can design a little bit. I didn’t realize how much I knew until I started participating on the board a lot.


    Let me help you customize your theme, responsive header, Buddypress, Agentpress or technical issue!
    Visit me here: Cre8tiveDiva.com | Tweet Me! | Plus Me!
    When asking for help, please provide a link or screen shot showing your problem!

    #28994

    lindebjerg
    Participant
    Post count: 42

    You are sooooo great, I love Studiopress:)
    cheers and thanks
    jesper

    #29002

    anitac
    Participant
    Post count: 7032

    @lindebjerg let us know how it turns out.


    Let me help you customize your theme, responsive header, Buddypress, Agentpress or technical issue!
    Visit me here: Cre8tiveDiva.com | Tweet Me! | Plus Me!
    When asking for help, please provide a link or screen shot showing your problem!

    #29014

    lindebjerg
    Participant
    Post count: 42

    perfect, ready:) I works perfect now. The Homepage are now half minimum theme/half modern-portfolio theme.
    thank you for fast support

    #29017

    anitac
    Participant
    Post count: 7032

    I see it. It looks great!


    Let me help you customize your theme, responsive header, Buddypress, Agentpress or technical issue!
    Visit me here: Cre8tiveDiva.com | Tweet Me! | Plus Me!
    When asking for help, please provide a link or screen shot showing your problem!

Viewing 15 posts - 1 through 15 (of 16 total)

You must be logged in to reply to this topic.