web-dev-qa-db-fra.com

Comment créer une vue de grille personnalisée

J'aimerais créer une vue en grille pouvant être utilisée pour répertorier les éléments avec une vignette, un en-tête de description principale, un sous-titre et éventuellement des détails de tarification. Ce ne sera pas nécessairement pour le commerce électronique, car au départ il n'y aura pas de panier d'achat. Semblable à un message, cliquer sur l'élément devrait vous amener à un "message" complet pour cet élément avec plus d'informations.

Pour avoir une idée de ce que je pense, jetez un oeil ici: http://www.powerzoneequipment.com/inventory_search.asp?category=engines

Alors voici mes questions:
1) Est-ce que quelque chose comme ça existe déjà?
2) Quelles sont les exigences pour construire quelque chose comme ça? Devrait-il s'agir d'un plugin associé à un thème personnalisé qui le supporte? Ou cela pourrait-il être fait avec un thème personnalisé et un type de publication personnalisé?

Je me rends compte que ce que je demande pourrait être une fonctionnalité plus courante dans quelque chose comme Drupal. Cependant, je suis curieux de voir à quel point il serait difficile d’obtenir ce type d’affichage dans Wordpress.

2
HK1

Ce n'est pas si difficile du tout que vous appelez simplement votre catégorie en boucle dans un tableau du genre:

<table>
    <tr>
        <th>Photo</th><th>Item Brand, Model</th><th>Description</th><th>PSI</th><th>GPM</th><th>RPM</th><th>HP</th><th>Stock No.</th>
    </tr>
    <?php 
    while (have_posts()){
        the_post();
        ?>
        <tr>
            <td>
                <?php
                if(has_post_thumbnail()) {
                    the_post_thumbnail();
                } else {
                    echo '<img src="'.get_bloginfo("template_url").'/images/img-default.png" />';
                }
                ?>
            </td>
            <td>
                <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
            </td>
            <td>
                <?php the_excerpt(); ?>
            </td>
            <td>
                <?php echo get_post_meta($post->ID,'PSI',true); ?>
            </td>
            <td>
                <?php echo get_post_meta($post->ID,'GPM',true); ?>
            </td>
            <td>
                <?php echo get_post_meta($post->ID,'RPM',true); ?>
            </td>
            <td>
                <?php echo get_post_meta($post->ID,'HP',true); ?>
            </td>
            <td>
                <?php echo get_post_meta($post->ID,'Stock_No',true); ?>
            </td>
        </tr>
        <?php
    }
    ?>
</table>

Il utilise la vignette du message comme image, le nom du titre et le lien vers le "message complet", l'extrait comme description et suppose que vous avez des champs personnalisés nommés: PSI, GPM, RPM, HP et Stock_No.

Maintenant, cela fait, vous pouvez utiliser un type de message personnalisé, par exemple, vous pouvez appeler des produits et le différencier de vos messages ordinaires à l’aide de register_post_type .

add_action('init', 'custom_products_post_type_init');
function custom_products_post_type_init() 
{
  $labels = array(
    'name' => _x('Products', 'post type general name'),
    'singular_name' => _x('Product', 'post type singular name'),
    'add_new' => _x('Add New', 'Product'),
    'add_new_item' => __('Add New Product'),
    'edit_item' => __('Edit Product'),
    'new_item' => __('New Product'),
    'view_item' => __('View Product'),
    'search_items' => __('Search Products'),
    'not_found' =>  __('No Products found'),
    'not_found_in_trash' => __('No Products found in Trash'), 
    'parent_item_colon' => '',
    'menu_name' => 'Products'

  );
  $args = array(
    'labels' => $labels,
    'public' => true,
    'publicly_queryable' => true,
    'show_ui' => true, 
    'show_in_menu' => true, 
    'query_var' => true,
    'rewrite' => true,
    'capability_type' => 'post',
    'has_archive' => true, 
    'hierarchical' => false,
    'taxonomies' => array('category', 'post_tag'),
    'supports' => array('title','editor','author','thumbnail','excerpt','comments','custom-fields')
  ); 
  register_post_type('product',$args);
}

et si vous le faites de cette façon, il vous suffit d'ajouter un argument simple pour interroger au-dessus de la boucle en utilisant query_post pour lui indiquer que vous utilisez votre type de message personnalisé:

query_posts ('post_type =' product ');

j'espère que cela t'aides

2
Bainternet

Découvrez ce tutoriel: http://designm.ag/tutorials/jquery-display-switch/

Il peut être intégré assez facilement dans WordPress, comme le montre ce thème:
http://s51370.gridserver.com/x/

1
Justin