​

You may recall that the original Slater had access controls for projects and files. We didn't want just anyone going in there and rewriting our Javascript. However, managing access for teammates became cumbersome (I even added a "god mode" to give myself access to any project or file). Since we generally trusted each other and never had issues, we decided to leave it out of the latest version of Slater.

That said, we understand that some teams work differently, and maintaining control can be important. Workspaces can get cluttered, and access control can help. So, we’ve brought back project access controls, but only if you need them.

Here’s a brief demo of the new functionality and instructions on how to turn it on. This functionality is live so go check it out if you need to control access.

​

​

​

Community library scripts

👣 Track User​
​Tracks user navigation and populates a form field with the history.

🥅 Filter Out Selection​
Filter array elements matching button text on button click.

👱🏼‍♂️ Wes Pagination​
​A script for handling pagination by fetching and displaying content from the next or previous page without reloading the page.

Have you added a useful script to your library? Share it with us!

​

​

--

Javascript 101: Localstorage

Do you use localstorage? It's a tool that we find ourselves turning to more and more as we work on complex Webflow builds. For example, we used localstorage a lot on ask.edgarallan.com.

Localstorage is simple to leverage. Let's hit the key concepts:

What is localStorage? localStorage is a web storage object that allows you to store data in the browser. Unlike sessionStorage, which is cleared when the session ends (e.g., when the browser is closed), localStorage persists even after the browser is closed.

Basic Methods:

• localStorage.setItem(key, value): Saves data under a specific key.
• localStorage.getItem(key): Retrieves the value of a specific key.
• localStorage.removeItem(key): Removes a specific key-value pair.
• localStorage.clear(): Clears all data stored in localStorage.

Examples:

1. Storing Data ​
You can store a string as a value in localStorage:

// Store a string
localStorage.setItem('username', 'JohnDoe');

2. Retrieving Data​
To retrieve the stored data:

// Get the stored item
const username = localStorage.getItem('username');
console.log(username);  // Output: 'JohnDoe'

3. Removing Data​
You can remove a specific key-value pair:

// Remove 'username' from localStorage
localStorage.removeItem('username');

4. Clearing All Data ​
If you want to clear all stored data:

// Clear everything in localStorage
localStorage.clear();

To finish, let's show a solution to storing and using a user's theme performance:

// Save the theme preference
localStorage.setItem('theme', 'dark');

// Retrieve and apply the theme
const theme = localStorage.getItem('theme');
if (theme) {
  document.body.classList.add(theme);
}

Do you have any localstorage solutions that you want to share? The Community Library has some localstorage scripts that you may find helpful.

​

--

Your projects, supported by Slater

Our friend at Renflow Designs built a beautifully smooth site for saltmarshcounselling.ca. Go check it out!

Renflow Designs @RenflowDesigns Another client project wrapped up! Big thank you to Saltmarsh Counselling for trusting us to bring their vision to life. https://www.saltmarshcounselling.ca/ Here’s a look at what we did 🧵: #buildinpublic #webflow 9:49 AM • Aug 27, 2024 0 Retweets 6 Likes Read 2 replies

​

​

🤙 the Slater Team

​

If Slater helps you create better websites, please support the team behind it.