This is the September edition of our blog series showcasing the latest platform improvements in developer analytics, user feedback, release notes, and more!
Since launch, we’ve received hundreds of feature requests from developers and users alike. Feedback has been the source of some our most popular features. This month’s post is celebration of the innovation achieved when great ideas are shared.
Let’s dive in!
? Developer Analytics
Continuing with the theme of feedback, App developers can now track their apps’ popularity and growth:
App usage by month.
The usage charts help identify which changes have a positive impact on your app.
If you’ve created a paid app you can also track its financial performance:
App revenue & churn.
? User feedback
Charts and graphs are great for tracking trends, but what do your users actually think of your app? Wonder no longer; users can now leave comments when adding and removing apps from their site. Each comment includes sentiment tags and an optional message from the user.
Comments left by users before and after installing an app.
? Page Selectors
Cloudflare users have always been able to select which routes their apps are active, though this was too coarse for apps with arrays of options. We've introduced Page Selectors to limit entries to specific pages:
Limiting YouTube videos to specific routes on a site.
Page selectors are great for apps that create multiple elements such as arrays in YouTube’s videos, or CSSGram’s image filters. Developers can also use them to target existing elements on specific pages. Apps like Shepherd can use Page Selectors to insert user guides on specific pages too!
? Improved updates
We've included some updates — on App updates! Developers can now add release notes in their submissions:
Communicating your recent changes to users.
Your release notes will appear alongside other pending updates in the user’s Cloudflare Dashboard:
Users are notified of pending updates when visiting Cloudflare.
?? Developers. Developers. Developers. Developers...
I want to give a huge shout-out to the developers who have sent us their feedback and suggestions. Thank you again for joining us on this amazing adventure. Reach out at @CloudflareApps and let us know what you’d like to see next!!!
Until next time! ?
— Teffen
Powerful tools built by world-class developers, delivered by Cloudflare, easily added to your website.
Just for you
The new App Developer Playbook features a step-by-step marketing guide showing you how to make money selling your Cloudflare Apps. It was written using all of the knowledge and experience we’ve gained releasing Apps to Cloudflare users.
.content-box { margin: 1em auto; max-width: 100%; box-sizing: border-box; } .content-box img { padding: .5em; border: 1px solid #ddd; border-radius: 3px; max-height: 100%; box-sizing: border-box; } .content-box[data-image="1"] img { background-color: #fff; } .content-box[data-image="2"] img { background-color: #fff; } .content-box[data-image="3"] img { background-color: #eee; } .content-box[data-image="4"] img { background-color: #f3f3f3; } .content-box[data-image="5"] img { background-color: #f3f3f3; } .content-box[data-image="6"] img { background-color: #ebebeb; } @media (min-width: 768px) { .content-box[data-image="1"] img { height: 270px; } .content-box[data-image="2"] img { height: 270px; } .content-box[data-image="3"] img { height: 250px; } .content-box[data-image="4"] img { height: 460px; } .content-box[data-image="5"] img { height: 280px; } .content-box[data-image="6"] img { height: 250px; } } .content-footer { display: flex; align-items: center; justify-content: center; flex-flow: column; padding: 1em .5em; background: #272727; color: #f1f1f1; line-height: 1.533; position: absolute; left: 0; right: 0; } .content-footer .email-pitch { text-align: center; } .content-footer #mc-embedded-subscribe-form { display: flex; align-items: center; } .content-footer #mce-responses { margin-left: .5em; } .content-footer #mce-EMAIL { flex: 0 1 auto !important; width: 245px; margin: 0; } .content-footer #mce-EMAIL, .content-footer #mc-embedded-subscribe { height: 2.4em; font-size: 1.2em; line-height: 1; } .content-footer #mc-embedded-subscribe { padding: .55em 1em; font-weight: 500; } .content-footer #mc-embedded-subscribe-form, .content-footer #mc-embedded-subscribe-form > * { flex: 0 0 auto; } .content-footer .email-container { display: flex; } .content-footer .playbook-container { display: flex; align-items: center; } .content-footer .content-accent { flex: 0 0 auto; } .content-footer .content-accent img { height: 260px; margin-right: 2em; } .content-footer .content-headline { font-size: 2.1em; font-weight: bold; } .content-footer .content-description { font-size: .9em; max-width: 600px; margin-bottom: 1em; } @media (max-width: 768px) { .content-footer .email-container { flex: 1 1 auto; width: 100%; } .content-footer .playbook-container { flex-flow: column; } } /* Floating Sidebar */ body.floating-sidebar .primary-content, body.floating-sidebar .post-content { width: 100% !important; } body.floating-sidebar aside.sidebar { float: right !important; margin-bottom: 0.5em; } .post-content, .post-header { max-width: 36em; } body.floating-sidebar .post-content, body.floating-sidebar .post-header { max-width: none; } body.floating-sidebar .footer-nav { width: 100% !important; } /* Social */ .social { display: flex; align-items: center; } /*.fb_iframe_widget { padding-top: 3px; padding-right: 1px; }*/ .social > * + * { margin-right: 0 !important; margin-left: 7px !important; } .social > .IN-widget { margin-bottom: -2px !important; margin-left: 9px !important; } /* Hide period after author */ .post-header .meta a { border-right: 5px solid white; margin-right: -5px; position: relative; } /* Post */ body { background-color: white; } .post-header, .post-content p, .post-content h1, .post-content h2, .post-content h3, .post-content h4, .post-content h5, .post-content figcaption { display: block; margin-left: auto; margin-right: auto; width: 75%; } .post-content figcaption { text-align: center; font-style: italic; opacity: .8; margin-top: 0.2em; margin-bottom: 1.9em; font-size: .9em; } pre, code { font-size: inherit; line-height: inherit; } section.primary-content { font-size: 16px; line-height: 1.6; color: black; } blockquote { padding-bottom: 1.5em; padding-top: 1em; font-style: italic; font-size: 1.2rem; } blockquote.pull-quote-centered { font-size: 1.2em; text-align: center; max-width: 100%; margin-left: auto; margin-right: auto; } blockquote blockquote { margin-left: 1em; padding-left: 1em; border-left: 5px solid rgba(0, 0, 0, 0.2); padding-bottom: 0.5em; padding-top: 0.5em; margin-bottom: 0.5em; margin-top: 0.5em; } p.attribution { color: #666; font-size: 0.8em; padding-bottom: 1em; } a code.year { text-decoration: underline; } .closing-cards #mc_embed_signup .mc-field-group { margin: 0.75em 0; } .closing-cards #mc_embed_signup input { font-size: 1.5em; height: auto; } .closing-cards #mc_embed_signup input[type="email"] { border: 1px solid #bcbcbc; border-radius: 2px; margin-bottom: 0; } .closing-cards #mc_embed_signup input[type="submit"] { background: #f38020; color: #fff; padding: .8em 1em .8em 1em; white-space: nowrap; line-height: 1.2; text-align: center; border-radius: 2px; border: 0; display: inline-block; text-rendering: optimizeLegibility; -webkit-tap-highlight-color: transparent; -webkit-font-smoothing: subpixel-antialiased; user-select: none; -webkit-appearance: none; appearance: none; letter-spacing: .04em; text-indent: .04em; cursor: pointer; } .closing-cards #mc_embed_signup div.mce_inline_error { background-color: transparent; color: #C33; padding: 0; display: inline-block; font-size: 0.9em; } .closing-cards #mc_embed_signup p:not(:empty) { line-height: 1.5; margin-bottom: 2em; } .closing-cards #mc_embed_signup input[type="email"] { font-size: 20px !important; width: 100% !important; padding: .6em 1em !important; } .closing-cards #mc_embed_signup .mc-field-group { margin: 0 !important; } .closing-cards #mc_embed_signup input[type="submit"] { font-size: 20px !important; margin-top: .5em !important; padding: .6em 1em !important; } .closing-cards #mc_embed_signup div.mce_inline_error { padding: 0; margin: 0; color: #F38020 !important; } aside.section.learn-more { display: none; } .closing-cards { background: #eee; width: 100%; list-style-type: none; margin-left: 0; } .closing-card { width: calc(50% - 10px) !important; font-size: 20px; padding: 1.5em; display: inline-block; box-sizing: border-box; vertical-align: top; } #mc_embed_signup { max-width: 400px; margin: 1em auto; } @media (min-width: 768px) { #mc_embed_signup { margin-left: 1em; } } @media (max-width: 788px){ .closing-card { width: 100% !important; } .closing-card + .closing-card { border-top: 10px solid white; } }
(function () { 'use strict'
document.body.style.visibility = 'hidden'
function fakeReady (fn) { if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', fn) } else { fn() } }
window.$ = window.jQuery = function fakejQuery () { return { ready: fakeReady, fitVids: function () { // if (window.$.fn.fitVids) { // window.$.fn.fitVids.apply(window.$.fn, arguments) // } } } }
window.$.fn = window.$.fn || {}
function restyleBlog () { 'use strict'
if (window.innerWidth >= 800) {
var sidebar = document.querySelector('aside.sidebar')
var header = document.querySelector('header.post-header')
var post = document.querySelector('article.post')
try {
post.insertBefore(sidebar, header)
document.body.className += ' floating-sidebar'
} catch (e) { console.log('Style Error', e)}
}
try {
document.querySelector('body > .wrapper .sidebar').style.display = 'none'
} catch (e) { console.log('Style Error', e)}
try {
var tagFooter = document.querySelector('.post-content + footer')
tagFooter.appendChild(document.querySelector('.post-header .social'))
} catch (e) { console.log('Style Error', e)}
function resizeFooter () {
post.style.paddingBottom = footer.clientHeight + 'px'
}
try {
var signup = document.querySelector('#mc\_embed\_signup')
signup.querySelector('#mce-EMAIL').placeholder = '[email protected]'
signup.querySelector('#mc-embedded-subscribe').textContent = 'Get Updates'
signup.querySelector('#mc-embedded-subscribe').className += ' btn-warning'
var post = document.querySelector('.post-content')
var footer = post.querySelector('.content-footer')
footer.querySelector('.email-container').appendChild(signup)
window.addEventListener('resize', resizeFooter)
resizeFooter()
} catch (e) { console.log('Style Error', e)}
document.body.style.visibility = ''}
fakeReady(restyleBlog) })()