Cécile Plaire for Perséphone

Posted on Apr 12, 2022

Perséphone: New landing page and technical questions

#help #metoo #nocode #buildinpublic

Hey DHackers!
I come to give you some news about the Perséphone project 🙂

We just published our landing page! I used Dorik, an affordable and easy to use No-code tool. It was recommended to me because you can inject code easily (unlike Wix for example).

I wanted to link it to some analytic tools and got in touch with Antoine who recently made a post about Plausible. I decided to test this analytics tool for my page. It's even easier to use than Google Analytics, and just as complete for my project. Thanks Antoine for the suggestion!

The landing page is almost done and already quite functional.
However, I'm facing a problem and I need your help :

You probably know this, but victims of domestic violences are very much watched by their abusers. The abuser who catches the victim on such a site would feel threatened and might go into a rage and violence. Our goal is to ensure that victims are exposed to as little danger as possible.

So I would like to add a "leave page urgently" floating button to allow the victim to leave the website (and if possible delete it from their history, but I may be asking for a lot).

Apparently it is not possible to make such a button on Dorik with the No-Code options. So that's where the "inject code" option is useful, except that I don't know exactly how to do it... So here are my questions:

How do I make a floating button with CSS?
How do I make the button leave the web page? Would it be possible to delete the page from the history too?

Thanks for your help ! And don't hesitate if you have any feedback, suggestions or other ideas to help the victims 🙂

Top comments (13)

Rayan Nait Mazi • Apr 12 '22

For info, anyone can write code in the comments because Development Hackers supports markdown :)
Just wrap your code in three backticks and specify the language like this:



```javascript
const myMethod = (a, b) => {
   return a + b
}
```

And it will output this

const myMethod = (a, b) => {
   return a + b
}

So everyone can easily contribute to the CSS question for example :)

Raphaël Bismut • Apr 13 '22

Hi Cécile!

That's such a great project, I'm sure it'll be useful to so many victims!

To answer your question, maybe you can give the button an ID and use custom css to give a a fixed positioning:

#floating-button{
position: fixed;
bottom: 20px;
right: 20px;
}

Hope I could help!

Cécile Plaire • Apr 14 '22

Thank you Raphaël! I'll try that right now :)

Cécile Plaire • Apr 15 '22

It works perfectly, thanks a lot for your help :D

Loïc Berthelot • Apr 13 '22 • Edited

Hey @cecile 👋
Awesome project you got here 🚀

Concerning
How do I make the button leave the web page? Would it be possible to delete the page from the history too?

Considering that the id of your button is urgent-exit-btn

<script>   
// Make sure your page is fully loaded
window.addEventListener('load', function() {
   // Attach an event listener to your button
   document.getElementById("urgent-exit-btn").addEventListener("click", function() {
     // Close your tab
     window.close()
   });
})
</script>

Cécile Plaire • Apr 14 '22

Thanks Loïc, that's super nice of you! I'll try to do that now :)

Loïc Berthelot • Apr 14 '22

Keep us updated on your adventure !

Rayan Nait Mazi • Apr 15 '22

I just tried it and the emergency exit button sent me to a cooking website hahaha, good plan

Cécile Plaire • Apr 15 '22 • Edited

Aha, yes 😅 Actually I was trying to do what Loïc said (thank you again Loïc!). It works well while on my phone but doesn't work on my computer and I don't know why... So on your phone it is supposed to just close the page but on your computer it is redirecting to the cooking website aha.
Maybe some of you know why ?

developmenthackers.com/uploads/art...

Loïc Berthelot • Apr 19 '22

Hey @cecile 👋
Indeed after a bit of research the script doesn't work if the user directly comes from the browser. It works if you open your link from a third party (Instagram/Messenger etc...)

I would recommend that you simply not close the page but changes the webpage to another casual website✊

Ping me if needed 🚀

Cécile Plaire • Apr 21 '22 • Edited

Oh ok got it! I think I will just redirect to something more basic, like google for example. It will surely load faster than Marmiton. Thanks again for your help :)