TIPS AND TRICKS

  • Add Scroll & Offset To Elements

    UIkit3 has a convenient Scroll stack, into which you can drop many other stacks (buttons, headings, etc.) that it will turn into a link that when clicked will scroll smoothly to the element on the page linked to.

    The Scroll stack has an offset setting, which is really handy if you don't want to scroll directly to the element, but a point slightly above it.

    A typical use for the offset is when using the scroll stack on a page with a sticky menu: When clicked instead of the element you are scrolling to disappearing behind the sticky menu, you can tell the stack to "offset" it, so it the scroll stops before the element goers behind the menu.

    This is all great, and in most instances, works well. But, there are times when you don't want to, or can't use the scroll stack, for example, if you are using the Button Group stack, so instead, you can apply both the scroll AND offset directly to the button, or anything you want to turn into a clickable link.

    How?

    It's dead easy to do; this is how you do it for a button, other clickable stacks are the same....

    1. Add the element you want to be the link to the page, say a button.
    2. Click the "advanced" button at the bottom of settings.
    3. Add uk-scroll="offset: 150" to the attribute, changing the offset value to whatever pixel offset you want (in this example it's 150px).
    4. In the link settings add#divID in this example the div ID is "newry".
    5. Add the div ID to the advanced settings in the element you are scrolling to.

    That's it.

  • Off-Canvas Not Closing On Click With Scroll Integration

    In certain circumstances, particularly on single page "scrolling" websites, clicking a button added to the Off-Canvas stack with scrolling integration turned on fails to close the Off-Canvas menu.

    A typical scenario...

    You've built a single page website and are using the menu to scroll users up and down the page. On mobile you've added the Off-Canvas stack, to it you've added the Nav stack, and into it, you are adding buttons for the links via "empty" child stacks.

    In the button stack, you've clicked "Scroll" integration, so the page scrolls smoothly up and down on clicks.

    The problem is that while it all works as expected, upon clicking a button link, the Off-Canvas stack doesn't close.

    If you've recently seen this behaviour, you're not alone. And no, you're not going mad either, it used to work.

    Thankfully Lucas the UIkit3 RW developer has put a fix in place: The advanced setting options for buttons now contain a custom attribute option. The fix is to add the following...

    uk-toggle="target: #offcanvas"

    Make sure to add it to the Custom Attributes setting, NOt custom CSS, and only add it if the Off-Canvas stack isn't closing.

    Please Note

    To the best of my knowledge this issue, the Off-Canvas not closing on click is new. On a previous version (not sure which) things worked as expected. So, if you use this technique on a project you've recently updated, check it's working as expected. If not, use the trick above.

  • Insert Icons Into Text/Header Areas

    Sometimes you want to put an icon inline with a heading or body of text. You can do this using a myriad of native UIkit3 stacks if you wish, but a much simpler way is to simply insert the icon using some code.

    <span uk-icon="icon: uikit; ratio: 1.0"></span>

    Adding this code snippet to any text stack; heading, text, markdown, etc. will "pull in" the specified icon and make it inline-in with the text surrounding it.

    In this example, the icon is the UIkit one, as used on this site a lot, and it's set to a ratio size of 1. This means its size is 1x that of the base font size. If you wanted the icon to be double the size of the base font, you'd set a ratio size of 2, and so on.

    So, for instance...

    Before <span uk-icon="icon: uikit; ratio: 1.0"></span> after.

    Looks like this...

    Before after.

    You can change the colour and size of the icon by adding to the code appropriately.

    If you want the icon to be a link use this code instead...

    <a href="" class="uk-icon-link" uk-icon="uikit"></a>

    Example example.

    If you would like the icon to appear as a button use this...

    <a href="" class="uk-icon-button" uk-icon="uikit"></a>

    Example Example.

    And finally...

    If you simply want an icon at the start of a block of text, the Text stack has this feature baked right in to the settings.

    Check out the image below for the settings and see an example below the image.

  • Use A Pre-defined Subject In Contact Forms

    When you add a field to a form with the name "subject", Forms cleverly converts the content of this field to the subject line of the email. This is a great feature and gives the person completing the form full control, but there are times when you want to use a pre-defined subject line, perhaps to enact a rule when the email lands in your inbox, here we will show you how to achieve this.

    1. Add an input field to your form and select "Hidden" in the Type dropdown.
    2. Give the input the name "subject".
    3. Tick "Custom Value" and add your pre-defined subject line.
    4. Tick "Required"

    That's it. So long as you don't add another input and call it "subject", the message you put in the custom value box will automatically appear as the email subject line.

Contact UiKitter

The best way to contact us is via email. Use the form provided or if you prefer, send an email direct to ObscureMyEmail

For support, please click the link at the top of the page.

UIkitter is a service offered by Caffeine Injection. A web design and management company based in Ireland.

v1.4

Made By Caffeine Injection

Support

Want some help fast?

Try the UIkitter support forum at RW4All.

  • When making a support request please tell us which project/product you are having issues with.
  • Please give us as much info as possible. Tell us precisely what the problem is and if possible, a live URL displaying the problem.
  • We do not offer support for our free projects/products. Hey, they're free!
  • We aim to make the first response to all support requests within 24hrs. Bear in mind the timezone when chasing up, we're in Ireland.

Privacy Policy

About

Unlike the privacy policy on most websites, this one isn't copied from a generic template; it's been written from scratch by humans who have considered what modern websites do, how most people interact with them and what most people are bothered about when it comes to online personal data.

We've avoided legal jargon and covering every minute detail down to the nth degree. Instead, we've focused on what we consider to be the essential stuff and answering some of the real world questions you might have.

Overview

We respect your right to privacy and will always do our absolute best to ensure we conform to not just the laws at the time, but also our moral obligation to you. That's why we will never knowingly allow anyone to use any data about you that we hold unless legally required to do so, and we will always keep it secure and (where possible) will remove all trace of it at your request.

We usually only hold names and email addresses you provide us, but at times we may keep other identifiable data about you, gathered with your consent, to carry out our day to day business with you. For instance, you might supply us with data as part of an enquiry, or as part of a purchase, or a booking process for a service, etc. In all instances, this data is destroyed once it is no longer relevant or required or held securely if it forms part of a service agreement with you or there is a legal requirement for us to retain. In which case, we can keep data for up to seven years. Like most websites, this site uses cookies (read more about them below) and also like most websites this site may share your IP address (read more about them below) with some online services. By continuing to use the site, you agree to this. We don't do either of these things because we're evil, it's just for a modern website to work the way most people want them to work, you have to! DON'T PANIC though, for the majority of users, you're not directly identifiable by these actions. Big Brother isn't watching!

IP Address

An IP address is a unique number that identifies your computer on the internet; it is in the form of 111.222.333.444. Lots of services, like YouTube, Facebook, etc., requires that websites send them your IP address before they allow sites to display things like embedded video, or Facebook elements, and so on. In reality, your IP address isn't personal data, as 99% of the time, you can't be identified by it. Regardless, some consider do consider it as such, so to keep ourselves in the clear we've added this bit to our privacy policy: On occasion, your IP address may be shared with some service providers. Emails

Emails are typically kept until our inbox is full and we have a clear out and delete or archive all the old ones. We never use addresses obtained from emails for anything other than responding to the emails you send us. We don't harvest these emails for other purposes. Once we clear out our inbox and delete old emails from you, your details are gone.

Newsletter Sign-up

Our newsletter signup process is distinct from other areas of consent when it comes to your data and uses a double opt-in/2 step verification confirmation that complies with all the latest regulations (GDPR, etc.). It includes a clear indication from you that you wish to be added to our newsletter list. There is no ambiguity in our signup process; you can't sign up by mistake, nor can anyone signup with your email address due to the double opt-in/2 step verification. We record the location, time and place that you signed up. Removing yourself from our newsletter list is easy: click the unsubscribe link in the newsletters we send or use the Unsubscribe feature on our website.

We don't share our newsletter lists with anyone else, other than the service we employ to send out our newsletters.

Data Protection Officer

If you have any questions about our privacy policy and your data, or would like to know what data we hold about your you can contact us using the details on our regular contact page, making the subject of any email is: FAO: Data Protection Officer. We will then forward your email to our DPO who will respond accordingly.

In most circumstances, we will respond within 30 days.

If we suspect any abuses of this requirement (multiple requests in a short space of time etc.), we reserve the right to refuse.

For most requests to be processed, we will need you to provide proof as to who you are and that you have a lawful right to access the data.

Cookies

Cookies are tiny files that are added to your computer as you use and interact with websites. They are used mostly for good: To improve your experience, sometimes for bad: Search engines, Social sites etc. may use them to track what a computer (the computer, not the person) is looking at. Many like Google will use them to target you with adverts and for analytics, which results in them being able to build a profile of what you do online. You will get these cookies added to your computer when you land on certain websites, like Google, Youtube, Facebook etc. This site makes use of Cookies, mainly so we can be sure to only show you certain content once, for example, popups or reminders.

Cookies can sound a bit Orwellian and "Big Brother", but mostly they're pretty harmless and unless you land on a website that requests your data and you offer it, the data they hold is mostly anonymous, they don't have your name and email address etc. You can clear out your cookies by clearing your browser history. However, as we said, this site from time to time will use cookies (never for data gathering or advertising). It is generally a good practice to install a cookie manager so that you can see what websites install what cookies, as most have them but few admit to it.

Cookies generally fall into three categories: Session, 1st Party Persistent & 3rd Party. A fuller explanation of these is at the bottom of this privacy policy.

Cookies: Further Explained

Session cookies

Session cookies are added to your machine as you surf websites. They are only retained for as long as your browser remains open. They allow a form of memory to exist between your browser and the websites you visit, such as pages visited, shopping cart contents, last viewed items etc. These cookies will remain after you leave the website but will be deleted once you close the browser (fully close it, not hide or minimise it).

1st Party Persistent Cookies

"Persistent cookies" remain on your computer even after you've closed the browser. 1st Party cookies can only relay information back to the website that placed them on your computer. Typically they're used to store site preferences to save you from having to re-enter information on future visits. They may also be used to track your activities (links clicked, pages visited, etc.) while visiting a site. Persistent cookies remain on your computer until you remove them, generally by using the browsers clear history feature, although other methods exist.

3rd Party Persistent Cookies

"Persistent cookies" remain on your computer even after you've closed the browser. 3rd Party cookies are typically used when a website has part of its content delivered via a third party, like embedded videos, maps etc. Sites featuring advertising commonly use 3rd party cookies to deliver the adverts; Over time 3rd party cookies will build up a profile your online habits (websites viewed, links clicked etc. so they can deliver targeted ads. 3rd party cookies have other purposes too, for more information on this we suggest you search the internet for "what do 3rd party cookies do?". We try to avoid third-party cookies as much as is possible. However, we may, from time to time, utilise third party content and cannot guarantee that such content does not have third-party cookies delivered with it. Persistent cookies remain on your computer until you remove them, generally by using the browsers clear history feature, although other methods exist.

We value your privacy. No identifiable data is stored or passed to third parties. By continuing you agree to this statement.