Rich Snippet support and shortcode question

Hi Frold,

Thanks for asking questions, which I will answer as second.

First of all I want to say that; most of us (wp devs) are volunteers and will helping you by making plugins theme’s etc. to make your WordPress-life easier. It’s very easy to rate a plugin with 1 star, without putting effort by yourself. It could be broken by another plugin or your theme itself. I can help you if you give me more information( do you get errors, does it has css-overruling, logs etc etc).

Second, as I already announced, Google Rich snippets is a good idea, and will be added in the next update.

greetz

Hey,

Im sorry if I was too fast to say this was not working.

But I did try many things and it would not work

Setup:
Latest WP 3.7.1

Plugins:
BackUpWordPress
Google Analytics Dashboard for WP
Google Doc Embedder
Google XML Sitemaps
upPrev
User Submitted Posts
WP-Optimize
WTI Like Post

Theme:
Meet Gavern

Let me give you some details.

When I make a new post I get this metabox when creating a new post:

Screendump 1

After I have updated my post the metabox look like this:
Screendump 2

When I put in

[averageRating]

in a post gives me this

Screendump 3

and when a user may add a comment the comment field look like this

Screendump 4

Eg. see: https://18-13.dk/uncategorized/test-dd-rating/ (I did set the creation date to 2 years ago – this way it will not spoil my blog. I will delete the post when you have seen it)

tnx frold, for giving me input. If I look at your code, I notice that the css and the js are not loading. You get the following errors:

Failed to load resource: the server responded with a status of 404 (Not Found) https://18-13.dk/wp-content/plugins/dd_ratings/css/style.css
Failed to load resource: the server responded with a status of 404 (Not Found) https://18-13.dk/wp-content/plugins/dd_ratings/js/default.js?ver=3.7.1

Strange because you said it works at the admin-side correctly and it uses the same files over there. Look at your file or directory permissions; are they set well? Is the path correctly to the plugin?

Thanks for a quick reply!

Well, I dont think it is a permission issue.

Ahh it seem like you call the files the wrong way.

Eg try to use this code instead in the dd_rating.php

/**
*   Enqueue plugin style-file (CSS) and js file for frontend
*/
function dd_add_files_to_body_tag()
{
    wp_register_style( 'dd_css_style_to_body_tag', plugins_url('/css/style.css', __FILE__) );
    wp_enqueue_style( 'dd_css_style_to_body_tag' );
    wp_enqueue_script( 'dd_js_file_to_body_tag', plugins_url( '/js/default.js', __FILE__ ) , array( 'jquery' ), '' );
}
add_action( 'wp_enqueue_scripts', 'dd_add_files_to_body_tag' );

It did solve some of it:

Take a look at: https://18-13.dk/uncategorized/test-dd-rating/

To call the files to be used in the backend use something like

/**
*   Enqueue plugin style-file for backend
*/
function dd_add_style_to_backend()
{
    wp_register_style( 'dd_css_style_to_backend', plugins_url('/path/filename.css', __FILE__) );
    wp_enqueue_style( 'dd_css_style_to_backend' );
}
add_action( 'admin_init', 'dd_add_style_to_backend' );

(I did upgrade: https://18-13.dk/uncategorized/test-dd-rating/ – to see the images live)

I did recode the dd-rating.php file to this

< ?php
/*
Plugin Name: DD_Ratings
Version: 1.1
Plugin URI: https://dijkstradesign.com
Description: A plug-in to add rating-functionality to comments
Author: Wouter Dijkstra
Author URI: https://dijkstradesign.com
*/

/*  Copyright 2013  WOUTER DIJKSTRA  (email : [email protected])

    This program is free software; you can redistribute it and/or modify
    it under the terms of the GNU General Public License, version 2, as
    published by the Free Software Foundation.

    This program is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with this program; if not, write to the Free Software
    Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA  02110-1301  USA
*/
require_once('inc/functions.php');

require_once('inc/add_to_admin_comments.php');
require_once('inc/add_to_admin_posts.php');
require_once('inc/add_to_comment.php');
require_once('inc/add_to_comment_form.php');

require_once('inc/shortcode.php');

/**
*   Enqueue plugin style-file (CSS) and js file for frontend
*/
function dd_add_files_to_body_tag()
{
    wp_register_style( 'dd_css_style_to_body_tag', plugins_url('/css/style.css', __FILE__) );
    wp_enqueue_style( 'dd_css_style_to_body_tag' );
    wp_enqueue_script( 'dd_js_file_to_body_tag', plugins_url( '/js/default.js', __FILE__ ) , array( 'jquery' ), '' );
}
add_action( 'wp_enqueue_scripts', 'dd_add_files_to_body_tag' );

/**
*   Enqueue plugin style-file for backend
*/
function dd_add_style_to_backend()
{
   wp_register_style( 'dd_css_style_to_backend', plugins_url('/css/style.css', __FILE__) );
   wp_enqueue_style( 'dd_css_style_to_backend' );
   wp_enqueue_script( 'dd_js_file_to_backend', plugins_url( '/js/default.js', __FILE__ ) , array( 'jquery' ), '' );

}
add_action( 'admin_init', 'dd_add_style_to_backend' );

And it did solve a lot.

Now it look like this in the backend

For comments
Screendump

For setting in a post
Screendump

In frontend for a post where the averagetag
[averageRating]
gives
Screendump

When you see the list of all post it look like this
Screendump

But there is still an issue with the rating box in the comment area where it look like this
Screendump

I dont know why you see the Json box?

To get rich snippet support like here: https://www.google.com/webmasters/tools/richsnippets?q=http%3A%2F%2F18-13.dk%2Funcategorized%2Ftest-dd-rating

Open /inc/shortcode.php

FIND (about line 132)

$averageOutput .= '
             <li class="clearfix">
                <div class="starTitle">' . $rateTitle . '</div>
                 <div class="star-holder star' . $rateRank . '" title="average:' . $itemPercent . '% participants:' . $itemParticipants . '">
                    <div class="star star-rating" style="width: ' . $itemPercent . '%"></div>
                </div>
                <div class= "textParticipants">
                    <div class="number">' . $itemParticipants . '</div>
                        <div class="icon"></div>
                    </div>
                <div class="textAverage">
                   <span class="comment-count">' . number_format($itemPercent, 2, '.', '') . '%</span>
                </div>
            </li>';

REPLACE WITH

$averageOutput .= '
             <li class="clearfix">
                <div itemscope itemtype="https://data-vocabulary.org/Review-aggregate">
                    <div class="starTitle">' . $rateTitle . '</div>
                    <div class="star-holder star' . $rateRank . '" title="average:' . $itemPercent . '% participants:' . $itemParticipants . '">
                        <div class="star star-rating" style="width: ' . $itemPercent . '%"></div>
                    </div>
                    <div class= "textParticipants">
                        <div class="number"><span itemprop="votes">' . $itemParticipants . '</span></div>
                        <div class="icon"></div>
                    </div>
                    <div class="textAverage">
                        <span class="comment-count">
                        <span itemprop="rating" itemscope itemtype="https://data-vocabulary.org/Rating">
                        <span itemprop="average">' . number_format(($itemPercent/20), 2, '.', '') . '</span>
                        stars out of
                        <span itemprop="best">5</span>
                        <meta itemprop="worst" content="1"/>
                        </span>
                        </span>
                    </div>
                </div>
            </li>';

Eg. use this snippet instead to get title support

$averageOutput .= '
             <li class="clearfix">
                <div itemscope itemtype="https://data-vocabulary.org/Review-aggregate">
                    <div class="starTitle"><span itemprop="itemreviewed">' . $rateTitle . '</span></div>
                    <div class="star-holder star' . $rateRank . '" title="average:' . $itemPercent . '% participants:' . $itemParticipants . '">
                        <div class="star star-rating" style="width: ' . $itemPercent . '%"></div>
                    </div>
                    <div class= "textParticipants">
                        <div class="number"><span itemprop="votes">' . $itemParticipants . '</span></div>
                        <div class="icon"></div>
                    </div>
                    <div class="textAverage">
                        <span class="comment-count">
                        <span itemprop="rating" itemscope itemtype="https://data-vocabulary.org/Rating">
                        <span itemprop="average">' . number_format(($itemPercent/20), 2, '.', '') . '</span>
                        stars out of
                        <span itemprop="best">5</span>
                        <meta itemprop="worst" content="1"/>
                        </span>
                        </span>
                    </div>
                </div>
            </li>';

Hi frold,

Tnx for the solution of fixing the css and js loading issue. It’s implemented in the next update. The json textarea will be a hidden input, so it’s not visible anymore. Next step is the rich snippets. One comment on your snippet: Not everybody is using the shortcode, so it needs to be included as its own file so it’s always there. Already working locally!

Will be deployed this week/weekend

Good point…

Thanks

solved in 1.2