Skip to main content

Issues with newest code

Answered
WatsonJH

Hi,

I tried to implement the newest code, released in august, for GraphComment into a Ghost blog. However, it does not seem to work. (No issues with the old code)

  1. On page load, the page seems to have a semi-transparent overlay, but no comment section is visible and I cannot clic anywhere.
  2. Secondary issue, I can customize the color of the Button but not the bubble one in the bottom right corner.
  3. This code, isn't it suppose to update itself?
  4. / HIGHLY RECOMMENDED
      //  uid: "...", // uniq identifer for the comments thread on your page (ex: your page id)

Thank you :)

0

Comments

11 comments

Date Votes
  • Official comment
    GraphComment support team

    Hello,

    Did you try this tutorial?

    https://gist.github.com/ddtraceweb/15ff171ee00d9db8ba6c695873a7d938

  • WatsonJH
    • Edited

    Hi,

    The issue was with AMP, if I disable the AMP function in the GraphComment admin then it works.

    However I still have 2 issues.

    1. It does not detect light vs dark mode
    2. The bubble does not have the same colour as the button. 

    FYI, with the old code, the dark vs light was working.

    Edit: I fixed the colour for the bubble by adding:

    "bubble": {
    "background":"#487ec0",
    "color":"#000000"
    }
    0
  • WatsonJH

    Dark mode vs light mode still won't work. I am not sure why...

    0
  • WatsonJH

    Any ideas?

    0
  • GraphComment support team

    Hello, when you force the mode in Settings of your admin, does it work ? Is it the automatic detection that won't work ?

    0
  • WatsonJH

    Hi,

    The automatic detection does not work at all, the light theme for GC stays whether the site uses the light or dark theme globally.
    When I force it, it becomes partially dark. See below

    0
  • GraphComment support team

    Ok, I see you use the sidepanel, this is why it's not working.

    In this case, you can define the colors yourself, here are the variables for your GC tag :

    export type GCOverlayParams = {
  alternate?: boolean;
  background?: string;
  pageWidth?: number;
  visible?: boolean;
  width?: number;
  zindex?: number;

  button?: {
    background?: string;
    color?: string;
    label?: string;
    link?: string;
    mobileLink?: string;
    target?: HTMLElement;
    width?: number;
  };

  bubble?: {
    background: string;
    color: string;
    placement: Record<string, string>;
    zindex: number;
  };
};
    0
  • WatsonJH

    I am not sure where to set this :/ 

    With the older version of the code, the sidepanel was working fine for auto-detection of the theme colours.

    Here is the code I use: 

    /* - - - CONFIGURATION VARIABLES - - - */

    var__semio__params = {
    graphcommentId:"MySiteID", // make sure the id is yours
    behaviour: {
    // HIGHLY RECOMMENDED
    // uid: "...", // uniq identifer for the comments thread on your page (ex: your page id)
    uid:"ghost-{{comment_id}}",
    url:"{{url absolute="true"}}",
    telemetricThroughCmp:true
    },
    // configure your variables here

    "sidePanel": {
    "width":null,
    "button": {
    "background":"#487ec0",
    "color":"#e6e6e6",
    "label":"Rejoindre la discussion"
    },

    "bubble":true,
    "visible":false,
    "bubble": {
    "background":"#487ec0",
    "color":"#e6e6e6"
    },
    },
    }
    0
  • GraphComment support team

    Hello, there was a bug, we've fixed it. Sorry about that.

    Please add this variable to your script:
    you can force it with 'light' or 'dark' value.

    //force dark theme
integration: {
  theme: 'dark',	
},
    0
  • WatsonJH
    • Edited

    Hi,

    And if I want it to automatically change, do I have to change something? 

    Forcing it with your code works. But the autodetection does not.
    Also, loading times are higher. 

    Edit: I tried changing dark by auto in the snippet of code you gave me, but it creates a hybrid theme :D and the results are the same if I load my site with the light theme and dark theme.

    0
  • WatsonJH

    Hi,

    The theme still does not adapt automatically. If I write light, it loads the light one, if I write dark it loads the dark one.
    But if I write auto, it is a mix between the 2. It looks the same if my site has the light or dark theme activated. It looks like the screenshot in my last post.
    If I do not specify any colour in the code, it loads the light theme.
    It used to work well with the previous version of the code a few months ago.

    0

Please sign in to leave a comment.

Didn't find what you were looking for?

New post