Making WordPress.org

Changeset 4937


Ignore:
Timestamp:
02/19/2017 02:49:41 PM (10 years ago)
Author:
ocean90
Message:

Rosetta: Add thumbnail support to showcase CPT.

Allows to define a custom website screenshot if the auto-generated screenshot doesn't look pretty because of cookie notices or loading animations.

Fixes #2515.

Location:
sites/trunk/global.wordpress.org/public_html/wp-content
Files:
4 edited

Legend:

Unmodified
Added
Removed
  • sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/showcase/rosetta-showcase.php

    r3656 r4937  
    3535                add_filter( 'manage_edit-' . $this->post_type . '_sortable_columns', [ $this, 'showcase_sortable_columns' ], 10, 0 );
    3636                add_filter( 'sharing_meta_box_show', [ $this, 'disable_sharing_meta_box' ], 10, 2 );
     37                add_theme_support( 'post-thumbnails', [ 'showcase' ] );
     38                add_image_size( 'showcase-thumbnail', 440, 330, true );
    3739        }
    3840
    … …  
    4244        public function register_post_type() {
    4345                $labels = [
    44                         'name'               => _x( 'Showcase', 'post type general name', 'rosetta' ),
    45                         'singular_name'      => _x( 'Showcase Site', 'post type singular name', 'rosetta' ),
    46                         'add_new'            => _x( 'Add New', 'showcase item', 'rosetta' ),
    47                         'add_new_item'       => __( 'Add New Site', 'rosetta' ),
    48                         'edit_item'          => __( 'Edit Site', 'rosetta' ),
    49                         'new_item'           => __( 'New Site', 'rosetta' ),
    50                         'view_item'          => __( 'View Site', 'rosetta' ),
    51                         'search_items'       => __( 'Search Showcase', 'rosetta' ),
    52                         'not_found'          => __( 'Nothing found', 'rosetta' ),
    53                         'not_found_in_trash' => __( 'Nothing found in Trash', 'rosetta' ),
     46                        'name'                  => _x( 'Showcase', 'post type general name', 'rosetta' ),
     47                        'singular_name'         => _x( 'Showcase Site', 'post type singular name', 'rosetta' ),
     48                        'add_new'               => _x( 'Add New', 'showcase item', 'rosetta' ),
     49                        'add_new_item'          => __( 'Add New Site', 'rosetta' ),
     50                        'edit_item'             => __( 'Edit Site', 'rosetta' ),
     51                        'new_item'              => __( 'New Site', 'rosetta' ),
     52                        'view_item'             => __( 'View Site', 'rosetta' ),
     53                        'search_items'          => __( 'Search Showcase', 'rosetta' ),
     54                        'not_found'             => __( 'Nothing found', 'rosetta' ),
     55                        'not_found_in_trash'    => __( 'Nothing found in Trash', 'rosetta' ),
     56                        'featured_image'        => __( 'Website Screenshot', 'rosetta' ),
     57                        'set_featured_image'    => __( 'Set website screenshot', 'rosetta' ),
     58                        'remove_featured_image' => __( 'Remove website screenshot', 'rosetta' ),
     59                        'use_featured_image'    => __( 'Use as website screenshot', 'rosetta' ),
    5460                ];
    5561
    … …  
    6672                        'can_export'           => false,
    6773                        'exclude_from_search'  => true,
    68                         'supports'             => [ 'title', 'excerpt' ],
     74                        'supports'             => [ 'title', 'excerpt', 'thumbnail' ],
    6975                        'menu_icon'            => 'dashicons-slides',
    7076                        'register_meta_box_cb' => [ $this, 'register_showcase_meta_box' ],
    … …  
    208214
    209215                        case 'description' :
    210                                 the_excerpt();
     216                                if ( has_excerpt() ) {
     217                                        the_excerpt();
     218                                } else {
     219                                        echo '—';
     220                                }
    211221                                break;
    212222
    213223                        case 'url' :
    214224                                $url = get_post_meta( $post_id, '_rosetta_showcase_url', true );
    215                                 echo '<a href="' . esc_url( $url ) . '">' . esc_url_raw( $url ) . '</a>';
     225                                if ( $url ) {
     226                                        echo '<a href="' . esc_url( $url ) . '">' . esc_url_raw( $url ) . '</a>';
     227                                } else {
     228                                        echo '&mdash;';
     229                                }
    216230                                break;
    217231
    218232                        case 'shot' :
    219233                                $url = esc_url( get_post_meta( $post_id, '_rosetta_showcase_url', true ) );
    220                                 if ( $url ) {
    221                                         echo '<a href="' . esc_url( $url ) . '" target="_blank"><img width="200" src="https://wordpress.com/mshots/v1/' . urlencode( $url ) . '?w=400" /></a>';
     234
     235                                $image_url = '';
     236                                if ( has_post_thumbnail( $post_id ) ) {
     237                                        $image_url = get_the_post_thumbnail_url( $post_id, 'showcase-thumbnail' );
     238                                } elseif ( $url ) {
     239                                        $image_url = 'https://wordpress.com/mshots/v1/' . urlencode( $url ) . '?w=440';
     240                                }
     241
     242                                if ( $image_url ) {
     243                                        echo '<a href="' . esc_url( $url ) . '" target="_blank"><img src="' . esc_url( $image_url ) . '" width="200" alt=""></a>';
    222244                                }
    223245                                break;
  • sites/trunk/global.wordpress.org/public_html/wp-content/themes/rosetta/front-page.php

    r2249 r4937  
    8282        <li>
    8383                <a class="shot" href="<?php echo esc_url( $url ); ?>">
    84                         <img src="<?php echo esc_url( $rosetta->screenshot_url( $url, 230 ) ); ?>" width="230" alt="screenshot" />
     84                        <?php
     85                        if ( has_post_thumbnail( $item->ID ) ) {
     86                                echo get_the_post_thumbnail( $item->ID, 'showcase-thumbnail' );
     87                        } else {
     88                                ?>
     89                                <img src="<?php echo esc_url( $rosetta->screenshot_url( $url, 220 ) ); ?>" width="220" alt="" />
     90                                <?php
     91                        }
     92                        ?>
    8593                </a>
    8694                <?php echo esc_html( $item->post_title ); ?>
    8795                <br />
    88                 <a href="<?php echo esc_url( $url ); ?>"><?php _e( 'Visit the site &rarr;', 'rosetta' ); ?></a>
     96                <a class="showcase-url" href="<?php echo esc_url( $url ); ?>" rel="nofollow"><?php _e( 'Visit the site &rarr;', 'rosetta' ); ?></a>
    8997        </li>
    9098<?php
  • sites/trunk/global.wordpress.org/public_html/wp-content/themes/rosetta/style-rtl.css

    r2176 r4937  
    256256        text-align: center;
    257257        margin: 0;
    258         font-size: 85%;
     258        -webkit-column-count: 2;
     259        -moz-column-count: 2;
     260        column-count: 2;
     261        -webkit-column-gap: 15px;
     262        -moz-column-gap: 15px;
     263        column-gap: 15px;
     264}
     265
     266@media screen and (min-width: 700px) {
     267        ul#showcase {
     268                -moz-column-count: 4;
     269                -webkit-column-count: 4;
     270                column-count: 4;
     271        }
    259272}
    260273
    261274#showcase li {
    262         display: inline-block;
    263         margin-left: 6%;
    264         width: 20%;
    265 }
    266 
    267 #showcase li:last-child {
    268         margin-left: 0;
     275        display: block;
     276        break-inside: avoid;
     277        page-break-inside: avoid;
     278        margin-bottom: 30px;
    269279}
    270280
    … …  
    275285        border: 1px solid rgb(204, 204, 204);
    276286        padding: 0;
    277 }
    278 
    279 #showcase a {
    280         font-size: 110%;
     287        line-height: 1;
     288}
     289
     290#showcase .shot img {
     291        width: 220px;
     292}
     293
     294#showcase li,
     295#showcase .showcase-url {
     296        font-size: small;
     297}
     298
     299#showcase .showcase-url {
     300        display: inline-block;
     301        margin-top: 6px;
    281302}
    282303
    … …  
    322343textarea {
    323344        background-color: #fff;
     345        -webkit-border-radius: 0;
    324346        border-radius: 0;
    325347        font-size: 14px;
    … …  
    350372        padding: 0.375em;
    351373        width: 100%;
     374        -webkit-box-sizing: border-box;
     375        box-sizing: border-box;
    352376}
    353377
    … …  
    594618
    595619/**
     620 * Move this section to wp4.css when en-US updates.
     621 */
     622#wporg-footer h6 {
     623        font-family: Georgia, Times, "Times New Roman", serif;
     624        color: #b4b9be;
     625}
     626
     627/**
    596628 * Media Queries
    597629 */
  • sites/trunk/global.wordpress.org/public_html/wp-content/themes/rosetta/style.css

    r2383 r4937  
    256256        text-align: center;
    257257        margin: 0;
    258         font-size: 85%;
     258        -webkit-column-count: 2;
     259        -moz-column-count: 2;
     260        column-count: 2;
     261        -webkit-column-gap: 15px;
     262        -moz-column-gap: 15px;
     263        column-gap: 15px;
     264}
     265
     266@media screen and (min-width: 700px) {
     267        ul#showcase {
     268                -moz-column-count: 4;
     269                -webkit-column-count: 4;
     270                column-count: 4;
     271        }
    259272}
    260273
    261274#showcase li {
    262         display: inline-block;
    263         margin-right: 6%;
    264         width: 20%;
    265 }
    266 
    267 #showcase li:last-child {
    268         margin-right: 0;
     275        display: block;
     276        break-inside: avoid;
     277        page-break-inside: avoid;
     278        margin-bottom: 30px;
    269279}
    270280
    … …  
    275285        border: 1px solid rgb(204, 204, 204);
    276286        padding: 0;
    277 }
    278 
    279 #showcase a {
    280         font-size: 110%;
     287        line-height: 1;
     288}
     289
     290#showcase .shot img {
     291        width: 220px;
     292}
     293
     294#showcase li,
     295#showcase .showcase-url {
     296        font-size: small;
     297}
     298
     299#showcase .showcase-url {
     300        display: inline-block;
     301        margin-top: 6px;
    281302}
    282303
Note: See TracChangeset for help on using the changeset viewer.