facebook.pug – Facebook tools

View source code on Github

---

Like buttons

mixin facebook-like(href)
  - if ("layout" in attributes)
    - layout = attributes.layout;
    - delete attributes.layout;
  - else
    - layout = "standard";
  - if ("action" in attributes)
    - action = attributes.action;
    - delete attributes.action;
  - else
    - action = "like"
  - if ("size" in attributes)
    - size = attributes.size;
    - delete attributes.size;
  - else
    - size = "small";
  - if ("show_faces" in attributes)
    - show_faces = attributes.show_faces;
    delete attributes.show_faces;
  - else
    - show_faces = true;
  - if ("share" in attributes)
    - share = attributes.share;
    - delete attributes.share;
  - else
    - share = true;
  - if ("colorscheme" in attributes)
    - colorscheme = attributes.colorscheme;
    - delete attributes.colorscheme;
  - else
    - colorscheme = "light";
  - src = `https://www.facebook.com/plugins/like.php?href=${href}&layout=${layout}&action=${action}&size=${size}&show_faces=${show_faces}&share=${share}&colorscheme=${colorscheme}`
  - if ("app_id" in attributes)
    - app_id = attributes.app_id;
    - delete attributes.app_id;
    - src = src + `&appId=${app_id}`
  - if ("alt" in attributes)
    - alt = attributes.alt;
    - delete attributes.alt;
  - else
    - alt = true;
  iframe(src=`${src}`
         scrolling="no" frameborder="0"
         allowtransparency="true"
         allow="encrypted-media"
         width="450"
         height="80")&attributes(attributes)
    - if (alt)
      | Your browser does not support iframes.

+facebook-like(href)(layout="standard", action="like", size="small", show_faces=true, share=true, app_id=null, width="450", height="80")

Creates a “like” facebook button pointing to content referenced by href parameter.

See also

Facebook Like button documentation.

Arguments:

• href (string) – Endpoint to your web content that you want to be liked when “Like” button will be clicked.
• layout (string, optional) –

  Select a design between next availables:

  • standard (default): Minimum width 225px, default width 450px and height 35px (without photos) or 80px (with photos).
  • button_count: Minimum width 55px, default width 55px and height 65px.
  • button: Minimum width 90px, default width 90px and height 20px.
  • box_count: Minimum width 47px, default width 47px and height 20px.
• action (string, optional) – Verb that will be shown inside button. You can select between "like" and "recommend". As default "like".
• size (string, optional) – Button size, you can select it between "small" and "big". As default "small".
• show_faces (bool, optional) – Specify if must be shown profile photographies (only with "standard" design). As default true.
• share (bool, optional) – Specify if the iframe element must be include a “Share” button. As default true.
• colorscheme (string, optional) – Colors scheme that facebook plugin will use fot the button external text. Select it between "light" and "dark". As default "light".
• app_id (integer, optional) – App identificator used by recopile data from post interactions. As default null.

Usage

Input

+facebook-like("https://github.com/mondeja/pug-mixins")(share=false, height="50")

Output

<iframe src="https://www.facebook.com/plugins/like.php?href=https://github.com/mondeja/pug-mixins&layout=standard&action=like&size=small&show_faces=true&share=false&colorscheme=light" scrolling="no" frameborder="0" allowtransparency="true" allow="encrypted-media" width="450" height="50"></iframe>

Render

---

Embed posts

mixin facebook-post(user_id, post_number)
  - if ("show_text" in attributes)
    - show_text = attributes.show_text;
    - delete attributes.show_text;
  - else
    - show_text = true;
  - src = `https://www.facebook.com/plugins/post.php?href=https%3A%2F%2Fwww.facebook.com%2F${user_id}%2Fposts%2F${post_number}&show_text=${show_text}`
  - if ("app_id" in attributes)
    - app_id = attributes.app_id;
    - delete attributes.app_id;
    - src = src + `&appId=${app_id}`
  - if ("alt" in attributes)
    - alt = attributes.alt;
    - delete attributes.alt;
  - else
    - alt = true;
  iframe(src=`${src}`
         scrolling="no" frameborder="0"
         allowtransparency="true"
         allow="encrypted-media"
         width="500"
         height="289")&attributes(attributes)
    - if (alt)
      | Your browser does not support iframes.

+facebook-post(user_id, post_number)(app_id=null)(width="450", height="289")

Insert a post given a post number and user identificators.

See also

Facebook embedded posts documentation.

Arguments:

• user_id (string) – Post user identificator. You can obtain it accessing a post page and copying the string between facebook.com/ and /posts/.
• post_number (integer) – Post number identificator. You can obtain it accessing a post page and copying the number after /posts/ in the url.
• app_id (integer, optional) – App identificator used by recopile data from post interactions. As default null.

Usage

Input

+facebook-post("alvaro.mondejarrubio", 1880014045362442)(width="80%" height="300")

Output

<iframe src="https://www.facebook.com/plugins/post.php?href=https%3A%2F%2Fwww.facebook.com%2Falvaro.mondejarrubio%2Fposts%2F1880014045362442&show_text=false" scrolling="no" frameborder="0" allowtransparency="true" allow="encrypted-media" width="80%" height="300"></iframe>

Render