Talk presented on Magnolia Conference 2014 of the Open Source Java Content Management System Magnolia.
Learn how (and why) Aperto built an easy-to-use Open Source Magnolia App just for managing vanity URLs.
Presented by Jörg von Frantzius, app programming by Frank Sommer.
Powerful Google developer tools for immediate impact! (2023-24 C)
Mconf14 aperto vanity url-app
1. There Is anApp for…
Vanity URLs!Magnolia Conference 2014 Technical Track, June 26th, Basel
2. 2
About me
Jörg von Frantzius
Systems Architect
Software-engineering background
Joined Aperto in 2010
Technical supervision for exciting and
demanding Magnolia projects since then
E.g.
Middle East Broadcasting Company Dubai
http://www.mbc.net/
Kanton Basel-Stadt http://www.bs.ch/
4. 4
Who We Are Today
Facts and Figures
40Million US$
Turnover (Gross income) 2013
400Heads at present
Growing steadily and soundly
International branches
Europe (Germany, Switzerland)
Middle East (Dubai)
China (Beijing, Shanghai)
10of the largest owner-managed
advertising agencies in Germany
Top
3
400Heads at present
6. Aperto And Magnolia
A Strong Partnership Since 2006
6
More than 40 successfully implemented Magnolia projects
High competence in the execution and implementation of large and
technologically sophisticated projects, e.g. business integration, high
performance and security
Joint product development with Magnolia
(STK – Standard Templating Kit)
Over 50 Magnolia-experienced and trained employees
in our departments technology, UX Design, Design and Project
Management
Experienced with international projects in Germany, China, Dubai,
Switzerland and UK
8. Vanity URLs – What Is It?
Antti Hietala‘s great blog post
on vanity URLs with Magnolia:
“Vanity URLs are short, easy to remember Web addresses used for
campaigns, microsites and landing pages. They are a key Internet
marketing tool.”
Mostly used to drive user from some other medium to a web page
E.g. URLs shown on TV, poster campaigns, print advertisement
Just in case you wonder…
9. Not Just Short URLs
Vanity URLs: not to be confused with short URLs, e.g.
http://goo.gl/2Yl2J4
• No one can remember that
• No one wants to type it in
Let alone typing this in on a mobile phone!
Must be easy to remember and spell
10. An Example
Imagine you are waiting for your train (or in your train)
And you can’t help staring at that poster in front of you.
Imagine now, that poster would really incite your interest
in, say, Aperto’s work for the Kanton Basel Stadt ;).
Which URL would you more likely try to type in on your mobile?
(or: shameless plug)
13. No Need for Typing in on a Mobile Phone
“Drive user from other medium to a web page” …
There is a more fun way of opening a URL
from another medium on a mobile phone
QR Codes!
(Alas, only if you have an app for that on your mobile phone…)
15. QR Codes – a Dispute
Image source and great article:
http://techcrunch.com/2013/05/29/people-
actually-use-qr-codes-in-china/
(image originally found via Adriaan Bloem)
16. Well, Yes, QR Codes.
Obviously, there is a need for creating QR Codes
Wasn’t supported yet directly in Magnolia
(And also we were in need of a nice visual feature
to show in our app at the conference!)
17. In Summary: A Common Use Case
How often do you remember having seen
simple catchy URLs (or QR Codes) outside of the web?
Obviously, creating Vanity URLs is a very common use case
Aperto’s customer projects required it often enough to create a dedicated app
18. Why an App?
But why an app for Vanity URLs
If Magnolia supports it anyway?
(except for QR Codes)
Let’s see what the caveat is …
19. Magnolia and Vanity URLs
Magnolia does support Vanity URLs out of the box
(see e.g. again Antti Hietala‘s blog post on how to do it)
We’re going to focus on path-based Vanity URLs
i.e. not involving custom domain names
It‘s supported
20. Vanity URL Technically
Usually that’s a permanent 301 redirect to the real page URL, i.e.
• browser will show real URL after redirect
• search engines preserve ranking for real URL
(For SEO reasons that’s usually what you want!)
Just a redirect
21. Configuring a Path-Based Vanity URL
1. Go to config app
2. Locate your module
3. Add node “virtualURIMapping”
4. Add configuration like this:
(and use “redirect:” instead
of “forward:”)
i.e. without the app
25. Without App: Access to Config Workspace Required
Hard and dangerous to do for page editors
without technical knowledge
(Ever locked yourself out of Magnolia with a virtual URL mapping?)
Experienced web admins must do it
Not for average page editor
27. Let‘s Empower Page Editors
Some large companies have large page editor workforce
who should be able to create vanity URLs easily
Without the app, editors have to ask web admins
Or they might simply avoid the hassle
Disentangle page editors and web admins for this task
Web admins have better things to do anyway
34. View QR Code
Intended for export
(right-click „Save image as…“)
Contains URL of the redirect target,
not the Vanity URL itself!
(avoids redirect on slow mobile)
37. Magnolia‘s New Content App Framework Works!
It turns out: Magnolia‘s content app framework is flexible and powerful
Positive for user: they will immediately:
• feel at home
• know how to use it
Positive for Developers: need to customize only details + few custom classes
39. Some Implementation Details
Time to give credits:
All programming + configuration
done by Frank Sommer @Aperto
I‘m only doing the talking
40. Subapps
Using standard Magnolia classes
Browser: provides list overview
Details: provides editor
Preview:
both for link target and QR Code
(essentially an iframe)
41. Browser SubApp Content Views
List and search only
Just cut away
what we don‘t need
(tree and thumbnail
don‘t make sense for
this app)
43. QR Code Preview
Standard app image provider
VanityUrlSaveFormAction saves
image to binary node „qrCode“
That‘s where the configured
standard image provider picks it
up:
45. Custom VirtualURIMapping for Link Evaluation
Incoming requests for
Vanity URLs:
evaluated in custom
VirtualURIMapping
(looks up Vanity URL
+ site in
vanityUrlworkspace)
47. It‘s Open Source!
Free to use
Vanity URL app is released as GPLv3
Find the sourcecode on Github: https://github.com/aperto/magnolia-vanity-url
If you modify the source, please fork us on Github!
48. Find it in the Magnolia Forge
Magnolia Jenkins will deploy artifacts to Magnolia Nexus
(even though code is on Github)
Please enter bug reports, enhancement or feature requests:
https://jira.magnolia-cms.com/browse/VANITY
49. Thank you!
Jörg von Frantzius SystemsArchitect
E-Mail joerg.frantzius@aperto.de
Phone +49 (0) 30 – 283 921 – 0
ApertoAG – In der Pianofabrik
Chausseestr. 5
10115 Berlin
Hinweis der Redaktion
So let us start now.
Today, a total of 400 people work at Aperto‘s international presences, whereby a quarter – which means 100 of these people – are working as developers or engineers. Okay guys, let us not go deeper into business details. We‘ll progress to the next charts.
Next chart is showing a selection of international clients. Without going to deep here, please let me state that: Aperto really does understand the public business. Even our clients believe so That‘s why a huge governmental organisations like The Federal Government of Germany has chosen Aperto as their solution partner.
Paired with our understanding of our clients needs, Aperto offers wide-spread know-how and the man power needed, to handle large projects. In addition to that. Aperto has far-reaching practice experience in managing huge CMS Magnolia projects, as we did and do for our clients:
AIRBUS Group, a European multinational aerospace and defence corporation
mbc Group, first private free-to-air satellite broadcasting company in the Arab World
MIGROS, Switzerland‘s largest retail company
Bank of Scotland, Oldest bank in the UK
Rossmann, Germany‘s No.1 Drugstore
and quite recently for the Kanton Basel-Stadt