For the proper functioning of this web application, make sure you have enabled JavaScript.
For more information consult the F.A.Q..

 

Try the new Dibloc app!

Bring with you all the power of Dibloc concentrated in a very light PWA

Later

Do you want to publish content?

Try now Dibloc and post free all the dibs you want...
just few seconds!

Later

This web application employs several cookie types for its complete functioning: technical cookies only to allow the use of the service and also third-party cookies to personalize content and ads. You can allow the use of the latter to improve your experience on Dibloc and you can change your preferences in this regard at any time.
For more information consult the Cookie Policy.

Dib sharing button

How to insert and configure the Dibloc sharing button!

The Dib button allows you to instantly share on Dibloc, any web page on which it is installed.
Clicking on the Dib button automatically opens a pop-up window to publish your Dib: it will already be complete with a title, text and any photo on the page to be shared!

What is the Dib button?

A small widget developed to simplify the sharing of content on Dibloc.
To add it, just add a portion of HTML code (snippet) anywhere on the page you want to share, so the Dib button will appear!

Dib button generator

Enter in URL field, the link to the resource you want to share and click on GENERATE CODE. Copy and then paste the snippet generated on the page where you want the Dib button to appear.

Advanced management

Example code to insert

You can generate the snippet automatically, or customize it by following this complete example and setting the individual parameters.

<a href="https://www.dibloc.com/account/share"
class="dib-btn" data-dib-btype="default">Dib</a>
<script src="https://www.dibloc.com/me/js/dib.js" async></script>

This is an example of the HTML code to copy and paste into the body of the web page to be shared, and consists of a a tag with dib-btn class containing the href attribute that identifies the link to be shared and additional data- attributes for additional parameters.
Plus the JavaScript script code that allows asynchronous linking of the widget to the page and loading the Dib button.

In the event that there are multiple Dib buttons on the page, you need to include the code only once.

How to configure the Dib button

The main parameter to set is the absolute URL (HTTP/HTTPS) of the page to be shared. Simply add it as a url query parameter in the href attribute of a tag.

<a href="https://www.dibloc.com/account/share?url=http://www.example.com"
class="dib-btn" data-dib-btype="default">Dib</a>

Another option is to pass the absolute URL through the data-dib-href attribute.

<a href="https://www.dibloc.com/account/share"
class="dib-btn" data-dib-btype="default"
data-dib-href="http://www.example.com">Dib</a>

An additional mode is offered by the use of an <link rel="canonical"> element containing the canonical link of the page.

<link rel="canonical"
href="http://www.example.com" />

Finally you can leave the ability to make the widget to read the Open Graph meta tags on the page; the tag with the og:url property will be checked and eventually used.

<meta property="og:url"
content="http://www.example.com" />

In the absence of a valid link set, the Dibloc widget is able to detect the URL of the page, but it is not recommended for the presence of any unneeded query parameters.

Customize the Dib button

You can use the round format of the button by changing the data-dib-btype attribute with the round value instead of default.

Round button

Default button

The dark coloring of the button can be used by adding the data-dib-color attribute with the dark value instead of default.

Dark round button

Dark default button

Discover other tools and ways to share on Dibloc! [+ info]

Do you need more info? Contact it the Support.