Registration is confusing for new users

Chris89

Hello. Over the past few weeks we have been running targeted ad campaigns all over the Internet. Thousands of people have visited the forum and left it, even though everything is perfectly organized.

I recently made a survey in our Facebook group and the most common answer is that the registration button is not visible on mobile’s homepage. Is there anything we could do about that? We’ve lost so many potential members due to incorrect button placement. Thank you.

Frink

Chris89 Surely you've gotten some engagement from users. Could you provide a few metrics, such as:

What page did they land on
What page did they exit on
What was the average bounce rate
What mobile devices were used the most
What were the average screen resolutions

If you don't feel comfortable sharing those metrics here, feel free to get in touch on Discord, AlanTheGreat#7472

luceos

Chris89 there might be a way to add a "user" icon next to the edit icon, or perhaps replace that edit/pencil icon when not logged in. The idea of the pencil is to force users to sign up or log in if they are not logged in.

Frink I don't understand why any of these metrics are necessary, the user survey already gave an answer to his question.

MikeJones

Kvothe Going to try this out too, thanks for sharing! Would make a great extension in the future!

Chris89 Over the past few weeks we have been running targeted ad campaigns all over the Internet.

I would love to see you open another discussion on these forums, and talk about what targeted ad campaigns you are using and your experiences. I am in a similar boat, trying both google and facebook ads.

Frink

luceos Yes, but if we can tell if they leave right from the homepage, it would prove that they struggle navigating. If I can see where the users went, then the site can be optimized better than just fixing the registration button

Kvothe

A simple workaround would be adding a Sign Up button to the Welcome message:

<a class="Button Button--primary" type="button" title="Sign Up" href="./signup"><span class="Button-label">Sign Up</span></a>
Since this requires Flagrow's Direct Links, which isn't yet updated for beta 8 (even thought it works for me) and reloads the whole page, it would be better to open the signup Modal with js, but I can't quite get it to work. It has to be something like this: app.modal.show(new SignUpModal()), but no idea how to access the SignUpModal here.

EDIT: Ok I solved the problem, with the whole page being reloaded. You still need Flagrow Direct Links and it isn't pretty but here it is:
<button class="Button Button--primary" type="button" title="Sign Up" onclick="app.modal.show(new app.routes.flagrowDirectLinksSignup.component.component.prototype.createModal)"><span class="Button-label">Sign Up</span></button>

Kvothe

You're right, I forgot about that.

<button id="welcomeButton" class="Button Button--primary" type="button" title="Sign Up" onclick="app.modal.show(new app.routes.flagrowDirectLinksSignup.component.component.prototype.createModal)"><span class="Button-label">Sign Up</span></button> <script>if(typeof app.session.user !== 'undefined'){ document.getElementById('welcomeButton').style.display = 'none'; } </script>
This fixes it, but it's even dirtier than before. I would normally put the javascript into the footer, but since the custom footer is loaded before flarums own js app.session.user wouldn't work.

Victor12

Kvothe That actually worked! It's funny how we got 17 new registrations since I added that button on the homepage today. Seemed to be a problem before. We used to get like 5-6 regs out of 1k visitors. Thanks again!

Update: Now there's this bigger gap under the description when you're logged in and the Sign Up button is gone.

Any way to fix it?

Corymillz404

Kvothe please where exactly do you add the code. rookie question

pxnji

Corymillz404 First, You should install Flagrow's Direct Links,, then go to Setting>Basic>Welcome Banner, put this code Kvothe on it. It works for me.

Victor12

Corymillz404 In your Welcome Banner (Basics - Welcome Banner).

Corymillz404

Victor12 throwing up parseError.

Victor12

Corymillz404 My bad. It’s supposed to be in your Welcome Banner, not Custom Styles. I’ve been working on that all day, yet I gave you the wrong one. Excuse me.

Kvothe

MikeJones I made a very simple extension for this: https://discuss.flarum.org/d/18812-sign-up-button

Corymillz404

Victor12 thanks. works perfect. It wont be a bad idea adding login button too.

pxnji

Corymillz404 Try use this code

<button id="welcomeButton" class="Button Button--primary" type="button" title="Sign Up" onclick="app.modal.show(new app.routes.flagrowDirectLinksSignup.component.component.prototype.createModal)"><span class="Button-label">Sign Up</span></button>

<button id="welcomeButton2" class="Button Button--primary" type="button" title="Login" onclick="app.modal.show(new app.routes.flagrowDirectLinksLogin.component.component.prototype.createModal)"><span class="Button-label">Login</span></button>

<script>if(typeof app.session.user !== 'undefined'){
document.getElementById('welcomeButton').style.display = 'none';
}
if(typeof app.session.user !== 'undefined'){
document.getElementById('welcomeButton2').style.display = 'none';
}
</script>

Victor12

Corymillz404 Or simply duplicate the code and replace app.modal.show(new app.routes.flagrowDirectLinksSignup with app.modal.show(new app.routes.flagrowDirectLinksLogin Here's how it looks for us.

Corymillz404

pxnji

Victor12 works great thanks a bunch

Corymillz404

Any css working code on how to make discussion view show on mobile screen?
Currently on beta 8.1
I think the number of views is going to make many people want to engage in discussions apart from posts.

matteocontrini

The welcome banner is going away in the next beta or so, anyway: https://github.com/flarum/core/pull/1215

And the reason is exactly this discussion, allowing extensions to create custom/advanced banners 🙂