Making WordPress.org

source: sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-themes/view-templates/theme-single.php

Last change on this file was 11983, checked in by dufresnesteven, 2 months ago

Themes: Add pattern preview to theme.

Props courane01, kafleg, poena, adamwoodnz, mtias, tellyworth
See: https://meta.trac.wordpress.org/ticket/5995

  • Property svn:eol-style set to native
File size: 9.3 KB
Line 
1<script id="tmpl-theme-single" type="text/template">
2        <div class="theme-navigation">
3                <button class="close"><?php _e( 'Return to Themes List', 'wporg-themes' ); ?></button>
4                <div class="navigation post-navigation">
5                        <button class="left dashicons dashicons-arrow-left-alt2"><span class="screen-reader-text"><?php _e( 'Show previous theme', 'wporg-themes' ); ?></span></button>
6                        <button class="right dashicons dashicons-arrow-right-alt2"><span class="screen-reader-text"><?php _e( 'Show next theme', 'wporg-themes' ); ?></span></button>
7                </div>
8        </div>
9        <div class="theme-wrap">
10                <div class="theme-about hentry">
11                        <# if ( data.is_outdated ) { #>
12                        <div class="theme-notice notice notice-warning notice-alt">
13                                <p><?php _e( 'This theme <strong>hasn&#146;t been updated in over 2 years</strong>. It may no longer be maintained or supported and may have compatibility issues when used with more recent versions of WordPress.', 'wporg-themes' ); ?></p>
14                        </div><!-- .theme-notice -->
15                        <# } #>
16
17                        <div>
18                                <h2 class="theme-name entry-title">{{{ data.name }}}</h2>
19                                <# if ( data.author.display_name ) { #>
20                                <div class="theme-author"><?php printf( _x( 'By %s', 'theme author', 'wporg-themes' ), '<a href="{{{ data.path }}}author/{{ data.author.user_nicename }}/"><span class="author">{{{ data.author.display_name }}}</span></a>' ); ?></div>
21                                <# } #>
22
23                                <# if ( data.show_favorites && data.is_favorited ) { #>
24                                        <span class="dashicons dashicons-heart favorite favorited"></span>
25                                <# } else if ( data.show_favorites ) { #>
26                                        <span class="dashicons dashicons-heart favorite"></span>
27                                <# } #>
28                        </div>
29
30                        <div class="theme-head">
31                                <div class="theme-actions clear">
32                                        <a href="{{{ data.preview_url }}}" class="button button-secondary alignleft"><?php _e( 'Preview', 'wporg-themes' ); ?></a>
33                                        <a href="{{ data.download_link }}" class="button button-primary alignright"><?php _e( 'Download', 'wporg-themes' ); ?></a>
34                                </div>
35
36                                <# if ( data.parent ) { #>
37                                <div class="theme-notice notice notice-info notice-alt">
38                                        <p class="parent"><?php printf( __( 'This is a child theme of %s.', 'wporg-themes' ), sprintf( '<a href="%1$s">%2$s</a>', '{{{ data.path }}}{{{ data.parent.slug }}}/', '{{{ data.parent.name }}}' ) ); ?></p>
39                                </div>
40                                <# } #>
41
42                                <div class="theme-meta-info">
43                                        <p class="version"><?php printf( __( 'Version: %s', 'wporg-themes' ), '<strong>{{ data.version }}</strong>' ); ?></p>
44                                        <p class="updated"><?php printf( __( 'Last updated: %s', 'wporg-themes' ), '<strong>{{ data.last_updated }}</strong>' ); ?></p>
45                                        <p class="active_installs"><?php printf( __( 'Active Installations: %s', 'wporg-themes' ), '<strong>{{ data.active_installs }}</strong>' ); ?></p>
46                                        <# if ( data.requires ) { #>
47                                        <p class="requires"><?php printf( __( 'WordPress Version: %s', 'wporg-themes' ), '<strong>' . sprintf( __( '%s or higher', 'wporg-themes' ), '{{ data.requires }}' ) . '</strong>' ); ?></p>
48                                        <# } #>
49                                        <# if ( data.requires_php ) { #>
50                                        <p class="requires_php"><?php printf( __( 'PHP Version: %s', 'wporg-themes' ), '<strong>' . sprintf( __( '%s or higher', 'wporg-themes' ), '{{ data.requires_php }}' ) . '</strong>' ); ?></p>
51                                        <# } #>
52                                        <# if ( data.theme_url ) { #>
53                                        <p class="theme_homepage"><a href="{{ data.theme_url }}"><?php _e( 'Theme Homepage', 'wporg-themes' ); ?></a></p>
54                                        <# } #>
55                                </div>
56                        </div><!-- .theme-head -->
57
58                        <div class="theme-info">
59                                <# if ( data.screenshot_url ) { #>
60                                <div class="screenshot">
61                                        <picture>
62                                                <source media="(min-width: 782px)" srcset="{{ data.screenshot_url }}?w=572&strip=all, {{ data.screenshot_url }}?w=1144&strip=all 2x">
63                                                <source media="(min-width: 481px) and (max-width: 782px)" srcset="{{ data.screenshot_url }}?w=700&strip=all, {{ data.screenshot_url }}?w=1400&strip=all 2x">
64                                                <source media="(min-width: 401px) and (max-width: 480px)" srcset="{{ data.screenshot_url }}?w=420&strip=all, {{ data.screenshot_url }}?w=840&strip=all 2x">
65                                                <source media="(max-width: 400px)" srcset="{{ data.screenshot_url }}?w=344&strip=all, {{ data.screenshot_url }}?w=688&strip=all 2x">
66                                                <img src="{{ data.screenshot_url }}?w=572&strip=all" srcset="{{ data.screenshot_url }}?w=1144&strip=all 2x" loading="lazy" alt="">
67                                        </picture>
68                                </div>
69                                <# } else { #>
70                                <div class="screenshot blank"></div>
71                                <# } #>
72
73                                <div class="theme-description entry-summary"><p>{{{ data.description }}}</p></div>
74
75                                <# if ( data.tags ) { #>
76                                <div class="theme-tags">
77                                        <h3><?php _e( 'Tags:', 'wporg-themes' ); ?></h3>
78                                        {{{ data.tags }}}
79                                </div><!-- .theme-tags -->
80                                <# } #>
81
82                                <div id="theme-patterns-js" class="theme-patterns" style="display: none;">
83                                        <h3><?php _e( 'Patterns:', 'wporg-themes' ); ?></h3>   
84                                        <div id="theme-patterns-grid-js" class="theme-patterns-grid"></div>
85                                        <a id="theme-patterns-button-js" class="theme-patterns-button" href="#" style="display:none"><?php _e( 'Show all patterns', 'wporg-themes' ); ?></a>
86                                </div>
87
88                                <div class="theme-downloads">
89                                        <h3><?php _e( 'Downloads Per Day', 'wporg-themes' ); ?></h3>
90                                        <div id="theme-download-stats-{{data.id}}" class="chart"></div>
91                                </div><!-- .theme-downloads -->
92                        </div>
93
94                        <div class="theme-meta">
95                                <div class="theme-ratings">
96                                        <h3><?php _e( 'Ratings', 'wporg-themes' ); ?></h3>
97
98                                        <a class="reviews-link" href="//wordpress.org/support/theme/{{ data.id }}/reviews/"><?php esc_html_e( 'See all', 'wporg-themes' ); ?></a>
99
100                                        <# if ( data.rating ) { #>
101                                        <div class="rating rating-{{ Math.round( data.rating / 10 ) * 10 }}">
102                                                <span class="one"></span>
103                                                <span class="two"></span>
104                                                <span class="three"></span>
105                                                <span class="four"></span>
106                                                <span class="five"></span>
107                                                <p class="description"><?php printf( __( '%s out of 5 stars.', 'wporg-themes' ), '<span>{{ Math.round( data.rating / 20 / 0.5 )*0.5 }}</span>' ); ?></p>
108                                        </div>
109                                        <# } else { #>
110                                        <div class="rating">
111                                                <div class="ratings"><?php _e( 'This theme has not been rated yet.', 'wporg-themes' ); ?></div>
112                                        </div>
113                                        <# } #>
114
115                                        <# if ( data.ratings ) { #>
116                                        <ul>
117                                                <?php foreach ( range( 5, 1 ) as $stars ) : ?>
118                                                <li class="counter-container">
119                                                        <a href="//wordpress.org/support/theme/{{ data.id }}/reviews/?filter=<?php echo $stars; ?>" title="<?php echo esc_attr( sprintf( _n( 'Click to see reviews that provided a rating of %d star', 'Click to see reviews that provided a rating of %d stars', $stars, 'wporg-themes' ), $stars ) ); ?>">
120                                                                <span class="counter-label"><?php printf( _n( '%d star', '%d stars', $stars, 'wporg-themes' ), $stars ); ?></span>
121                                                                <span class="counter-back">
122                                                                        <span class="counter-bar" style="width: {{ 100 * data.ratings[<?php echo $stars; ?>] / data.num_ratings }}%;"></span>
123                                                                </span>
124                                                                <span class="counter-count">{{ data.ratings[<?php echo $stars; ?>] }}</span>
125                                                        </a>
126                                                </li>
127                                                <?php endforeach; ?>
128                                        </ul>
129                                        <# } #>
130
131                                        <a class="button button-secondary" href="https://wordpress.org/support/theme/{{ data.id }}/reviews/#new-post"><?php _e( 'Add my review', 'wporg-themes' ); ?></a>
132                                </div><!-- .theme-rating -->
133
134                                <div class="theme-support">
135                                        <h3><?php _e( 'Support', 'wporg-themes' ); ?></h3>
136                                        <p><?php _e( 'Got something to say? Need help?', 'wporg-themes' ); ?></p>
137                                        <a href="//wordpress.org/support/theme/{{ data.slug }}" class="button button-secondary"><?php _e( 'View support forum', 'wporg-themes' ); ?></a>
138                                </div><!-- .theme-support -->
139
140                                <div class="theme-report">
141                                        <h3><?php _e( 'Report', 'wporg-themes' ); ?></h3>
142                                        <p><?php _e( 'Does this theme have major issues?', 'wporg-themes' ); ?></p>
143                                        <a rel="nofollow" href="https://make.wordpress.org/themes/report-theme/?rep-name={{ data.current_user }}&rep-theme={{ data.homepage }}&rep-subject=Reported+Theme:+{{ data.name }}" class="button button-secondary"><?php _e( 'Report this theme', 'wporg-themes' ); ?></a>
144                                </div><!-- .theme-report -->
145
146                                <div class="theme-translations">
147                                        <h3><?php _e( 'Translations', 'wporg-themes' ); ?></h3>
148                                        <p>
149                                                <a href="https://translate.wordpress.org/projects/wp-themes/{{ data.slug }}">
150                                                        <?php printf( __( 'Translate %s', 'wporg-themes' ), '{{ data.name }}' ); ?>
151                                                </a>
152                                        </p>
153                                </div><!-- .theme-translations -->
154
155                                <div class="theme-devs">
156                                        <h3><?php _e( 'Subscribe', 'wporg-themes' ); ?></h3>
157                                        <ul class="unmarked-list">
158                                                <li>
159                                                        <a href="//themes.trac.wordpress.org/log/{{data.id}}?limit=100&mode=stop_on_copy&format=rss">
160                                                                <span class="dashicons dashicons-rss"></span><?php _e( 'Development Log', 'wporg-themes' ); ?>
161                                                        </a>
162                                                </li>
163                                        </ul>
164
165                                        <h3><?php _e( 'Browse the Code', 'wporg-themes' ); ?></h3>
166                                        <ul class="unmarked-list">
167                                                <li><a href="//themes.trac.wordpress.org/log/{{data.id}}/" rel="nofollow"><?php _e( 'Development Log', 'wporg-themes' ); ?></a></li>
168                                                <li><a href="//themes.svn.wordpress.org/{{data.id}}/" rel="nofollow"><?php _e( 'Subversion Repository', 'wporg-themes' ); ?></a></li>
169                                                <li><a href="//themes.trac.wordpress.org/browser/{{data.id}}/" rel="nofollow"><?php _e( 'Browse in Trac', 'wporg-themes' ); ?></a></li>
170                                                <li><a href="//themes.trac.wordpress.org/query?keywords=~theme-{{data.id}}" rel="nofollow"><?php _e( 'Trac Tickets', 'wporg-themes' ); ?></a></li>
171                                        </ul>
172                                </div><!-- .theme-devs -->
173                        </div>
174                </div>
175        </div>
176</script>
Note: See TracBrowser for help on using the repository browser.