Grid listing

[Dominator69]

i would like to use listing that is main.php in the modern theme

Code: [Select]

<div class="latest_ads">
<h1><strong><?php _e('Latest job offers', 'bender') ; ?></strong></h1>
 <?php if( osc_count_latest_items() == 0) { ?>
    <p class="empty"><?php _e("There aren't job offers available at this moment", 'bender'); ?></p>
<?php } else { ?>
    <div class="actions">
      <span class="doublebutton <?php echo $buttonClass; ?>">
           <a href="<?php echo osc_update_search_url(array('sShowAs'=> 'list')); ?>" class="list-button" data-class-toggle="listing-grid" data-destination="#listing-card-list"><span><?php _e('List', 'bender'); ?></span></a>
           <a href="<?php echo osc_update_search_url(array('sShowAs'=> 'gallery')); ?>" class="grid-button" data-class-toggle="listing-grid" data-destination="#listing-card-list"><span><?php _e('Grid', 'bender'); ?></span></a>
      </span>
    </div>
    <ul class="listing-card-list" id="listing-card-list">
        <?php
            $i = 0;
            while ( osc_has_latest_items() ) {
                $class = '';
                if($i%3 == 0){
                    $class = 'first';
                }
                bender_draw_item($class);
                $i++;
            }
        ?>
    </ul>
    <?php if( osc_count_latest_items() == osc_max_latest_items() ) { ?>
        <p class="see_more_link"><a href="<?php echo osc_search_show_all_url() ; ?>">
            <strong><?php _e('See all offers', 'bender') ; ?> &raquo;</strong></a>
        </p>
    <?php } ?>
<?php } ?>
</div>

also i need codes  from main.css when adding this code i got Fatal error: Call to undefined function bender_draw_item() in /oc-content/themes/modern/main.php on line 105 - bender_draw_item($class);

i would like to have it in search page and in main thanks for any help
ps. i changed from bender to modern the codes i just posted

[design]

bender theme is dependent on a lot more then is "visible"
you will also need to copy over that bender function - just the part needed, to your other theme function.php

[Dominator69]

can someone tell me what i need to add from bender theme to the modern thanks in advance

[design]

in benders function.php find  bender_draw_item and copy all the function regarding that error to your moderns function.php

it will look like this

Code: [Select]

    if( !function_exists('bender_draw_item') ) {
        function bender_draw_item($class = false,$admin = false, $premium = false) {
            $filename = 'loop-single';
            if($premium){
                $filename .='-premium';
            }
            require WebThemes::newInstance()->getCurrentThemePath().$filename.'.php';
        }
    }
as this will not be the only function you will need, just copy each one over from "if(…. }" but not the whole file, just watch each error to get the function you need.

[Dominator69]

i copied bender_draw_item in the functions.php no errors but only blank no listing at all

[design]

I am all about swapping codes around from theme to theme, but this is the one thing I haven't done so I am not sure what all files you will need. but starting with the basics
you will need the
css/lass/etc that styles it
functions
images(?)
scripting (jquery?)
other dependent files (loop.php/premium.php)

as you add each piece it should show you what else is missing when you use your developer tools
here are the functions. you will also need to research in the forums on how to keep grid view as a default.

Code: [Select]

    if( !function_exists('bender_draw_item') ) {
        function bender_draw_item($class = false,$admin = false, $premium = false) {
            $filename = 'loop-single';
            if($premium){
                $filename .='-premium';
            }
            require WebThemes::newInstance()->getCurrentThemePath().$filename.'.php';
        }
    }
    if( !function_exists('bender_show_as') ){
        function bender_show_as(){

            $p_sShowAs    = Params::getParam('sShowAs');
            $aValidShowAsValues = array('list', 'gallery');
            if (!in_array($p_sShowAs, $aValidShowAsValues)) {
                $p_sShowAs = bender_default_show_as();
            }

            return $p_sShowAs;
        }
    }
    if( !function_exists('bender_default_show_as') ){
        function bender_default_show_as(){
            return getPreference('defaultShowAs@all','bender_theme');
        }
    }
hope this helps...

[Dominator69]

I am all about swapping codes around from theme to theme, but this is the one thing I haven't done so I am not sure what all files you will need. but starting with the basics
you will need the
css/lass/etc that styles it
functions
images(?)
scripting (jquery?)
other dependent files (loop.php/premium.php)

as you add each piece it should show you what else is missing when you use your developer tools
here are the functions. you will also need to research in the forums on how to keep grid view as a default.

Code: [Select]

    if( !function_exists('bender_draw_item') ) {
        function bender_draw_item($class = false,$admin = false, $premium = false) {
            $filename = 'loop-single';
            if($premium){
                $filename .='-premium';
            }
            require WebThemes::newInstance()->getCurrentThemePath().$filename.'.php';
        }
    }
    if( !function_exists('bender_show_as') ){
        function bender_show_as(){

            $p_sShowAs    = Params::getParam('sShowAs');
            $aValidShowAsValues = array('list', 'gallery');
            if (!in_array($p_sShowAs, $aValidShowAsValues)) {
                $p_sShowAs = bender_default_show_as();
            }

            return $p_sShowAs;
        }
    }
    if( !function_exists('bender_default_show_as') ){
        function bender_default_show_as(){
            return getPreference('defaultShowAs@all','bender_theme');
        }
    }
hope this helps...

didnt help i tried your code is looking for the loop page and new bender doesnt have that file
from the bender function file

Code: [Select]

if( !function_exists('bender_draw_item') ) {
        function bender_draw_item($class = false,$admin = false) {
            $size = explode('x', osc_thumbnail_dimensions());this is the only function i also tried to add this code which is under

Code: [Select]

<li class="listing-card <?php echo $class; ?>">
                <?php if( osc_images_enabled_at_items() ) { ?>
                    <?php if(osc_count_item_resources()) { ?>
                        <a class="listing-thumb" href="<?php echo osc_item_url() ; ?>" title="<?php echo osc_item_title() ; ?>"><img src="<?php echo osc_resource_thumbnail_url(); ?>" title="" alt="<?php echo osc_item_title() ; ?>" width="<?php echo $size[0]; ?>" height="<?php echo $size[1]; ?>"></a>
                    <?php } else { ?>
                        <a class="listing-thumb" href="<?php echo osc_item_url() ; ?>" title="<?php echo osc_item_title() ; ?>"><img src="<?php echo osc_current_web_theme_url('images/no_photo.gif'); ?>" title="" alt="<?php echo osc_item_title() ; ?>" width="<?php echo $size[0]; ?>" height="<?php echo $size[1]; ?>"></a>
                    <?php } ?>
                <?php } ?>
                <div class="listing-detail">
                    <div class="listing-cell">
                        <div class="listing-data">
                            <div class="listing-basicinfo">
                                <a href="<?php echo osc_item_url() ; ?>" class="title" title="<?php echo osc_item_title() ; ?>"><?php echo osc_item_title() ; ?></a>
                                <div class="listing-attributes">
                                    <span class="category"><?php echo osc_item_category() ; ?></span> -
                                    <span class="location"><?php echo osc_item_city(); ?> (<?php echo osc_item_region(); ?>)</span> <span class="g-hide">-</span> <?php echo osc_format_date(osc_item_pub_date()); ?>
                                    <?php if( osc_price_enabled_at_items() ) { ?><span class="currency-value"><?php echo osc_format_price(osc_item_price()); ?></span><?php } ?>
                                </div>
                                <p><?php echo osc_highlight( strip_tags( osc_item_description()) ,250) ; ?></p>
                            </div>
                            <?php if($admin){ ?>
                                <span class="admin-options">
                                    <a href="<?php echo osc_item_edit_url(); ?>" rel="nofollow"><?php _e('Edit item', 'bender'); ?></a>
                                    <span>|</span>
                                    <a class="delete" onclick="javascript:return confirm('<?php echo osc_esc_js(__('This action can not be undone. Are you sure you want to continue?', 'bender')); ?>')" href="<?php echo osc_item_delete_url();?>" ><?php _e('Delete', 'bender'); ?></a>
                                    <?php if(osc_item_is_inactive()) {?>
                                    <span>|</span>
                                    <a href="<?php echo osc_item_activate_url();?>" ><?php _e('Activate', 'bender'); ?></a>
                                    <?php } ?>
                                </span>
                            <?php } ?>
                        </div>
                    </div>
                </div>
            </li>
there is blank under latest listings

[design]

that is how the listings are pulled out of the database. The new bender combined the loops, so you need all three of them.
I thought you wanted this?

Code: [Select]

<?php
    
    // meta tag robots
    osc_add_hook('header','bender_follow_construct');

    bender_add_body_class('home');


    $buttonClass = '';
    $listClass   = '';
    if(bender_show_as() == 'gallery'){
          $listClass = 'listing-grid';
          $buttonClass = 'active';
    }
?>
<?php osc_current_web_theme_path('header.php') ; ?>
<div class="clear"></div>
<div class="latest_ads">
<h1><strong><?php _e('Latest Listings', 'bender') ; ?></strong></h1>
 <?php if( osc_count_latest_items() == 0) { ?>
    <div class="clear"></div>
    <p class="empty"><?php _e("There aren't listings available at this moment", 'bender'); ?></p>
<?php } else { ?>
    <div class="actions">
      <span class="doublebutton <?php echo $buttonClass; ?>">
           <a href="<?php echo osc_base_url(true); ?>?sShowAs=list" class="list-button" data-class-toggle="listing-grid" data-destination="#listing-card-list"><span><?php _e('List', 'bender'); ?></span></a>
           <a href="<?php echo osc_base_url(true); ?>?sShowAs=gallery" class="grid-button" data-class-toggle="listing-grid" data-destination="#listing-card-list"><span><?php _e('Grid', 'bender'); ?></span></a>
      </span>
    </div>
    <ul class="listing-card-list <?php echo $listClass; ?>" id="listing-card-list">
        <?php
            $i = 0;
            while ( osc_has_latest_items() ) {
                $class = '';
                if($i%3 == 0){
                    $class = 'first';
                }
                bender_draw_item($class);
                $i++;
            }
        ?>
    </ul>
    <div class="clear"></div>
    <?php if( osc_count_latest_items() == osc_max_latest_items() ) { ?>
        <p class="see_more_link"><a href="<?php echo osc_search_show_all_url() ; ?>">
            <strong><?php _e('See all listings', 'bender') ; ?> &raquo;</strong></a>
        </p>
    <?php } ?>
<?php } ?>
</div>

[Dominator69]

i wanted to create grid and list button like in bender theme for the latest listings

[design]

like I said..you need a lot of things to make it work.

like this will need to go on the main.php

:

<?php     $buttonClass = '';
    $listClass   = '';
    if(bender_show_as() == 'gallery'){
          $listClass = 'listing-grid';
          $buttonClass = 'active';
    }

as well as this part:

<div class="actions">
      <span class="doublebutton <?php echo $buttonClass; ?>">
           <a href="<?php echo osc_base_url(true); ?>?sShowAs=list" class="list-button" data-class-toggle="listing-grid" data-destination="#listing-card-list"><span><?php _e('List', 'bender'); ?></span></a>
           <a href="<?php echo osc_base_url(true); ?>?sShowAs=gallery" class="grid-button" data-class-toggle="listing-grid" data-destination="#listing-card-list"><span><?php _e('Grid', 'bender'); ?></span></a>
      </span>
    </div>
    <ul class="listing-card-list <?php echo $listClass; ?>" id="listing-card-list">
        <?php
            $i = 0;
            while ( osc_has_latest_items() ) {
                $class = '';
                if($i%3 == 0){
                    $class = 'first';
                }
                bender_draw_item($class);
                $i++;
            }
        ?>
    </ul>
    <div class="clear"></div>
    <?php if( osc_count_latest_items() == osc_max_latest_items() ) { ?>
        <p class="see_more_link"><a href="<?php echo osc_search_show_all_url() ; ?>">
            <strong><?php _e('See all listings', 'bender') ; ?> &raquo;</strong></a>
        </p>
    <?php } ?>
<?php } ?>
</div>

[design]

i copied bender_draw_item in the functions.php no errors but only blank no listing at all

after working on this benders grid/list option, i had to remove Facebook connect to get the page to show up, but now it is as you requested.

when you can, please post [solved] in the original subject.

[dev101]

Hi design,

thank you for this idea! I was doing similar thing to incorporate list/grid function in search results instead, not in the main page, but I forgot to copy the small button part php code and couldn't make it work. Now it is working perfectly!

To make it a complete solution here is what has to be done to get grid/list button on the search page results in Modern theme:

in functions.php put this code before the last ?> closing tag:

Code: [Select]

    if(!function_exists('bender_add_body_class_construct')) {
        function bender_add_body_class_construct($classes){
            $benderBodyClass = benderBodyClass::newInstance();
            $classes = array_merge($classes, $benderBodyClass->get());
            return $classes;
        }
    }
    if(!function_exists('bender_body_class')) {
        function bender_body_class($echo = true){
            /**
            * Print body classes.
            *
            * @param string $echo Optional parameter.
            * @return print string with all body classes concatenated
            */
            osc_add_filter('bender_bodyClass','bender_add_body_class_construct');
            $classes = osc_apply_filter('bender_bodyClass', array());
            if($echo && count($classes)){
                echo 'class="'.implode(' ',$classes).'"';
            } else {
                return $classes;
            }
        }
    }
    if(!function_exists('bender_add_body_class')) {
        function bender_add_body_class($class){
            /**
            * Add new body class to body class array.
            *
            * @param string $class required parameter.
            */
            $benderBodyClass = benderBodyClass::newInstance();
            $benderBodyClass->add($class);
        }
    }
    if(!function_exists('bender_nofollow_construct')) {
        /**
        * Hook for header, meta tags robots nofollos
        */
        function bender_nofollow_construct() {
            echo '<meta name="robots" content="noindex, nofollow, noarchive" />' . PHP_EOL;
            echo '<meta name="googlebot" content="noindex, nofollow, noarchive" />' . PHP_EOL;

        }
    }
    if( !function_exists('bender_follow_construct') ) {
        /**
        * Hook for header, meta tags robots follow
        */
        function bender_follow_construct() {
            echo '<meta name="robots" content="index, follow" />' . PHP_EOL;
            echo '<meta name="googlebot" content="index, follow" />' . PHP_EOL;

        }
    }

    if( !function_exists('bender_draw_item') ) {
        function bender_draw_item($class = false,$admin = false, $premium = false) {
            $filename = 'loop-single';
            if($premium){
                $filename .='-premium';
            }
            require WebThemes::newInstance()->getCurrentThemePath().$filename.'.php';
        }
    }

    if( !function_exists('bender_show_as') ){
        function bender_show_as(){

            $p_sShowAs    = Params::getParam('sShowAs');
            $aValidShowAsValues = array('list', 'gallery');
            if (!in_array($p_sShowAs, $aValidShowAsValues)) {
                $p_sShowAs = bender_default_show_as();
            }

            return $p_sShowAs;
        }
    }

    if( !function_exists('bender_default_show_as') ){
        function bender_default_show_as(){
            return getPreference('defaultShowAs@all','bender_theme');
        }
    }

/**

CLASSES

*/
class benderBodyClass
{
    /**
    * Custom Class for add, remove or get body classes.
    *
    * @param string $instance used for singleton.
    * @param array $class.
    */
    private static $instance;
    private $class;

    private function __construct()
    {
        $this->class = array();
    }

    public static function newInstance()
    {
        if (  !self::$instance instanceof self)
        {
            self::$instance = new self;
        }
        return self::$instance;
    }

    public function add($class)
    {
        $this->class[] = $class;
    }
    public function get()
    {
        return $this->class;
    }
}

in the beginning of search.php fill-in the empty <?php ... ?> space with this code

Code: [Select]

<?php

// list-grid selector

    bender_add_body_class('search');
    $listClass = '';
    $buttonClass = '';
    if(osc_search_show_as() == 'gallery'){
          $listClass = 'listing-grid';
          $buttonClass = 'active';
    }

?>

in search.php somewhere after <div id="main"> part where it is best to fit in. For example, in my case I have put it after "inner" div

Code: [Select]

            <div id="main">
                <div class="ad_list">
                    <div id="list_head">
                        <div class="inner">

<!-- Search results list-grid selector -->
<span class="doublebutton <?php echo $buttonClass; ?>">
<a href="<?php echo osc_esc_html(osc_update_search_url(array('sShowAs'=> 'list'))); ?>" class="list-button" data-class-toggle="listing-grid" data-destination="#listing-card-list"><span><?php _e('List', 'bender'); ?></span></a>
<a href="<?php echo osc_esc_html(osc_update_search_url(array('sShowAs'=> 'gallery'))); ?>" class="grid-button" data-class-toggle="listing-grid" data-destination="#listing-card-list"><span><?php _e('Grid', 'bender'); ?></span></a>
</span>

... rest of the code...

in style.css at the end of the file:

Code: [Select]


/* list-grid button */

.doublebutton {
float:right;
margin-left:10px;
}
.doublebutton a {
border:solid 1px #d1d1d1;
background-color:#f7f7f7;
-webkit-border-radius:2px;
border-radius:2px;
cursor:default;
font-size:11px;
font-weight:bold;
text-align:center;
white-space:nowrap;
height:16px;
outline:0;
padding:5px 6px;
display:block;
float:left;
}
.doublebutton a span {
text-indent:-9999px;
float:left;
width:16px;
height:16px;
background-image:url(images/icons.png);
cursor:pointer;
}
.doublebutton .list-button {
margin-right:-1px;
border-top-right-radius:0px;
border-bottom-right-radius:0px;
border-right:none;
}
.doublebutton .list-button span {
background-position:-16px -16px;
}
.doublebutton .grid-button {
border-top-left-radius:0px;
border-bottom-left-radius:0px;
border-left:none;
}
span.active a.grid-button span {
background-position:-16px 0;
}
span.active a.list-button {
border:solid 1px #D1D1D1;
background-color:#F7F7F7;
}
span.active a.list-button span {
background-position:0 -16px;
}
.active a.grid-button, .doublebutton a.list-button {
/* modify this line to change colors */
background-color: #35c3d9;
border-color: #23a4b8;
}

and finally:

Code: [Select]

copy icons.png from bender/images folder into modern/images folder

Regards

[design]

I also had to remove a dot from the icons image url when taking this to modern.

it's fun when you can pick themes part and put them back together in a unique way, or am I just nuts?

[dev101]

Yes, if you look at the above css code it is already corrected

Regards

[design]

may I see yours when your done dev101?