Awesome list of SOFTR tips

Hello everyone, :wave:

With the help of the community and some invested users like @dcoletta, I have launched a website where you can find some useful tips for SOFTR.

Here is the current list (Last update: 2022-06-27):

β†’ Access and Integrate forms through Popup (Modal)
β†’ Add a countdown / coming soon block
β†’ Add a dynamic breadcrumb block
β†’ add clickable contact links in listing lists and details block
β†’ Add confetti to a page
β†’ Add current user recordId to url
β†’ Add custom font
β†’ Add darkmode support
β†’ Allow a user of your site to sign in from a custom code block without using Sign In block
β†’ Always show a block on top of the screen (floating element)
β†’ Blur a section for non-logged-in users
β†’ Change background color across whole site
β†’ Change the page that opens after proceeding to the magic link
β†’ Change the text in the toggle of the pricing block
β†’ Change the url of logo click
β†’ Create a customized swiping experience
β†’ Create a like button
β†’ create an interactive status updater with JavaScript
β†’ Custom format a specific field
β†’ Customize a favicon for a specific page
β†’ Display an Illustration/Gif when a list is empty
β†’ Embed a user’s Instagram feed on their profile
β†’ Excerpt the first n words of a page for your SEO:Description field
β†’ Expand and collapse a block when another block in the page is clicked on
β†’ Force sign-in on upvote click
β†’ Generate slug from text
β†’ Go to homepage on 404 page not found
β†’ Have a responsive two-column layout
β†’ Hide a specific block only on Mobile (Responsive)
β†’ Hide button when field is empty
β†’ Hide Scrollbars for Embed Airtable form
β†’ Highlight the link in the header corresponding to the current page
β†’ How to use a gradient as a background color on a specific block?
β†’ Let users sample your site before requiring signup
β†’ Linking to linked record in listing detail
β†’ Load a default record on a page with both List and List Details blocks
β†’ Log out the current user
β†’ Make a real blog
β†’ Make all the links in a table open in new windows
β†’ Pass logged-in user data to embedded typeform
β†’ Pass on user and page details to an embedded Tally form
β†’ Pass the logged in users email to Crisp Chat
β†’ Pour Airtable data into templates in your list blocks and list details blocks
β†’ Pre-filter lists by url parameter
β†’ Random sort airtable records
β†’ Redirect logged in users to specific page
β†’ Remove nested scrollbar on Tally form
β†’ Script in Python in addition to Javascript
β†’ Set different colors for the List item tags
β†’ Show logged in user’s name in the website
β†’ Show monthly as default in pricing block
β†’ Translate the listing edit pop-up text
β†’ Use localized strings in your blocks

I hope that can help some of you! :smiley:

Cheers,
Joachim

12 Likes

Hey Joachim. We spoke over at nocode.ie (I think). Do you know of a good page refresh on edit or ajax snippet to get things current after an edit?

@Joachim,

Thanks for sharing this here :slight_smile:

Wow, thanks for this list. I’m a new user and will definitely pore over this! Also bookmarked!

2 Likes

Hey @AddyEdwin,

Thanks for joining Softr, let us know if you need help :slight_smile: Will be glad to help.

I just updated the list!
Almost doubled. :smiley:

1 Like

@Joachim,

Thanks a lot

Had trouble signing up on the sign up page.

Hi,
I’ll look today and will fix it if there is an issue.
Sorry about that

Just checking in if you had any luck figuring out the sign up issue. Would it be possible to share the Make a Real Blog information with me?

Hello everyone,

The website now has 68 tips !
I have very little time at the moment but will come back with more next month. :slight_smile:

Please share any code snippets or tutorial you might have!

Cheers

3 Likes

Great job!
Thanks for sharing.

I am trying to implement the confetti effect on a page following this thread:

Choose the page you want the confetti to appear on Go to Page settings > Custom code > Footer Paste this code in the box:

<script src=β€œhttps://cdn.jsdelivr.net/npm/canvas-confetti@1.5.1/dist/confetti.browser.min.js”></script>
<script>
var count = 200;
var defaults = {origin: { y: 0.7 }
};
function fire(particleRatio, opts) {
confetti(Object.assign({}, defaults, opts, {
particleCount: Math.floor(count * particleRatio)
}));
}
fire(0.25, {
spread: 26,
startVelocity: 55,
});
fire(0.2, {
spread: 60,
});
fire(0.35, {
spread: 100,
decay: 0.91,
scalar: 0.8
});
fire(0.1, {
spread: 120,
startVelocity: 25,
decay: 0.92,
scalar: 1.2
});
fire(0.1, {
spread: 120,
startVelocity: 45,
});
</script>

How do I refer to a specific page?

Example:
β€œCongratulation-page”

Hey @RafaPG,

Please, navigate to Pages > select your page > Settings > Custom Code add the code.

Just Save the changes and Publish the app :slight_smile:

1 Like