APEX is used in literally thousands of applications within Oracle. And in some of the latest apps that we're writing ourselves, in the footer we're including a short phrase which lets people know it was "built with Oracle APEX." We're proud of the app, proud of the UI, and we want people in the company to know that it's an APEX app. But Shakeeb showed me something last night that took this to a whole new level!
The instructions to add this to your APEX 5.1 application are extraordinarily simple:
- Create a new region on the Global Page (page 0) and set the Region Position to Footer. Set the Region Template to Blank with Attributes (no grid).
- Use this HTML as the Region Source:
<span class="footer-apex">Built with <span class="fa fa-heart"> <span class="u-VisuallyHidden">love</span> </span> using <a href="https://apex.oracle.com/" target="_blank" title="Oracle Application Express">Oracle APEX</a> </span>
- Add this CSS to your Theme Style by opening Theme Roller and pasting into the Custom CSS section:
.footer-apex {font-size: 11px; line-height: 16px; display: inline-block; vertical-align: top;} .footer-apex .fa.fa-heart { vertical-align: top; font-size: 10px; line-height: 16px; width: 16px; text-align: center; transition: color 1s ease; } .footer-apex:hover .fa.fa-heart { color: #FF0000; animation: pulse 1s infinite; } @keyframes pulse { 0% { transform: scale(0.9); } 70% { transform: scale(1.25); } 100% { transform: scale(0.9); } }
That's it! Simple. It might work in APEX 5.0 and later, but it will definitely work in APEX 5.1 and later.
I encourage everyone in the APEX community to add this to the footer of their applications. Many end users don't even know they're using an APEX application, or even what APEX is. This is an easy way to show it, and and show it with style!
BOOM!
3 comments:
Yet another GREAT thing from the APEX development group!! Hands down they do help us developers more than we know..
Thanks Joel, love it - works great in 5.0.3 as well.
It's right there in AskTom :-)
http://imgur.com/a/sTnhO
Post a Comment