How do I link a dynamic page to a unique member ID?

Ask the community
, ,
1

1392×876 158 KB

Hello good people of Wix Forum! Can anyone explain to me the necessary steps I need to take to link a dynamic page & dataset to unique member ID’s?

I have been trying for weeks. Any help will be greatly appreciated!

Thanks in advance,

Coby

2

Hey Coby,

You can use the to() function from the wix-location API.

To find the local URL of a dynamic page:

See the Page Info tab of the Page Settings panel for the URL structure. The actual URL used for navigation needs to contain values where the placeholders are.

For example, if the URL structure of your dynamic page looks like:

and you have an item with the title “Waffles”, the local URL to that page is /Recipes/Waffles.

You just have to make sure the dynamic page URL is set to use the ID.

Hope this helps!

Dara | Corvid Team

3

Hi Dara,

I got the problem, too, but in a kind of different way. For me, the dynamic page with the ID-url doesn’t seem to work. I posted my problem in detail on another post, maybe you can check it out and tell me what could help solve my problem? I would very much appreciate it.
My post is here:
https://www.wix.com/corvid/forum/community-discussion/dynamic-profile-page-with-id-url-doesn-t-work-error-404

4

@xxsingmusic4everxx Assuming that your dynamic page link structure is →
/members/userId
…where userId is the userId of current user…

This code worked fine for me → 

let userId  = wixUsers.currentUser.id;
wixLocation.to(`/members/${userId}`);
5

Can/will someone please show an up to date answer (05/2023).

I have looked everywhere for an example that uses ‘wix-member’ currentMember.GetMember() of which returns a member JSON object in the form of a promise.

From the promise you have access to many properties of the member, such as the following:

{
    "_id": "3ec83b8d-d643-4f4f-95a0-h3r0541ma780",
    "contactId": "e5f4bd54-15d8-4103-9ed2-h3r0541ma112",
    "loginEmail": "wda.movers.info@gmail.com",
    "profile": {
        "nickname": "wdamoversinfo",
        "slug": "wda-movers-info",
        "profilePhoto": {
            "id": "1bf8c6_h3r0541ma84c42bea5558006228fc195%7Emv2.png",
            "url": "https://static.wixstatic.com/media/1bf8c6_h3r0541ma84c42bea5558006228fc195%7Emv2.png",
            "height": 0,
            "width": 0
        }
    },
    "contactDetails": {
        "contactId": "e5f4bd54-85d8-4103-9ed2-h3r0541ma112",
        "phones": [],
        "emails": [
            "wda.movers.info@gmail.com"
        ],
        "addresses": [],
        "customFields": {}
    },
    "activityStatus": "ACTIVE",
    "privacyStatus": "PUBLIC",
    "status": "APPROVED",
    "lastLoginDate": "2022-09-23T01:24:52Z",
    "_createdDate": "2022-09-23T01:24:52Z",
    "_updatedDate": "2022-09-23T01:24:52.108Z"
}

import {currentMember} from 'wix-members';

export function myProfileButton_click(event) {
const member = currentMember.getMember()
  .then((member) => {
    const id = member._id;
    //for testing
    console.log(member);
    //notice: /collection/action/currentMember.id
    //also: url should be all lowercase
    wixLocation.to('/sitememberprofiles/update/' + id.toString());
    return member;
  })
  .catch((error) => {
    console.error(error);
  });
}

I’m trying to retrieve the member._id from the promise and use it as part of the slug using the ‘wix-location’ API .to() function

1st I: import { currentMember } from ‘wix-members’; then use .getMember() function to retrieve the JSON object from the Promise.

I really just wanted a second opinion on how I’m going about migrating the new changes from the old way of using: import wixUsers from ‘wix-users’; So, here I am figuring it out.

and doing the following:

import wixUsers from 'wix-users';

export function myProfileButton_click(event) { 
 
wixLocation.to(
'/sitememberprofiles/update/${wixUsers.currentUser.id}'
)
}

where you find the slug:

1422×967 353 KB

You can also choose what the slug is. If you have a different GUID you could use it or any of the fields in your collection if you wanted… But it should be a unique field in good practice.

If you found this answer and found it helpful please accept the answer. I honestly started this as a question and it slowly morphed into an answer, so I apologize if it sounds odd in places.

Here is the rest of the code you are wanting (I suspect):

import { currentMember, authentication} from 'wix-members';
import wixData from "wix-data";
import wixLocation from "wix-location";

// Get the button element
const loginButton = $w("#loginButton");
const myProfileButton = $w("#myProfileButton");

function handleLogin() {
    loginButton.label = "Logout";
    myProfileButton.show();
}

function handleLogout() {
    loginButton.label = "Login";
    myProfileButton.hide();
}

function handleUserState(member) {
    if (member) {
        handleLogin();
    } else {
        handleLogout();
    }
}

$w.onReady(() => {

    const member = currentMember.getMember();

    // Gets current member's data and then handles the users state UI
   member.then(member => handleUserState(member));

    // This code handles the user state UI when they login.
   authentication.onLogin(member =>  handleUserState(member))

    
})


export function loginButton_click(event) {
const loggedIn = authentication.loggedIn();
  console.log(loggedIn);
  if (!authentication.loggedIn()) {
     let userId;
     let userEmail;

    console.log('if NOT logged-in, handlelogout()')

    //Prompt the member to log-in
    authentication.promptLogin({ "mode": "login" }).then(() => {
      const userId = this.user.id;
      const userEmail = this.user.email;
      return wixData.query("SiteMemberProfiles").eq("_id", userId).find();
    }).then((results) => {
      if (results.items.length === 0) {
        console.log('results.items.length === 0')
        const toInsert = {
          "_id": userId,
          "email": userEmail
        };
        wixData.insert("SiteMemberProfiles", toInsert).catch((err) => {
          console.log(err);
        })
      } 
    else {
      console.log('results.items.length != 0')
       handleLogout(); 
      }
    }).catch((err) => {
    console.log(err);
    });
  }
  //member is logged out
  else {

    //log the user out
    authentication.logout();
    
    handleLogout();
    console.log('else, authentication.logout(); handlelogout();')
  }
}

I left my console.log()'s in it. Please upvote. This wasn’t easy (or hard) but still, it it help you. Help me.