Help Center

Everything you need to know about getting started with Beamer

How to add Beamer as a menu item using our WordPress plugin? 

Adding Beamer as a menu item using our WP plugin

Method 1: quick and easy implementation.  recommended

If you want to add Beamer as a menu item instead of a floating button, follow these steps:

  1. In your WordPress Dashboard, go to Appearance > Menus and select the Menu you want to edit in the top drop-down (if you have more than one menu).
  2. Select Beamer from the element list. Click on Beamer Trigger and then on Add to Menu.
  3. You can change the name of the menu item if you like.
  4. Don’t forget to save your changes before closing the page. And voilà.
    WP tutorial screenshot

Method 2: selecting an existing item by CSS class.

This method is very similar to the first but lets you use an element already present in your Menu using a custom CSS Class:

  1. Go to Appearance > Menus and create a Menu Item as a Custom Link or choose one that already exists. Leave a # in place of the URL (that will avoid linking to anywhere else).
    Beamer WP tutorial
  2. Open that menu item tab and search for the field CSS Classes. If you don’t see it you can activate it clicking on Screen Options in the top right corner of the page.
    Beamer WP tutorial step 2-2
  3. Choose a class name and fill the CSS Classes field. Make sure is a unique name without any uncommon characters. Save your changes.
    Beamer WP tutorial step 2-3
  4. Go to Settings > Beamer Settings and fill the selector field with your chosen class name with a dot at the beginning (e.g. for the class beamerLaunch, write .beamerLaunch). Save your changes and you’ll be ready to go.
    Beamer WP tutorial step 2-4

Method 3: select an existing element by ID.

This method is very similar to the first two but instead of a CSS Class it uses the automatically generated menu item id (e.g. menu-item-1010):

  1. Go to Appearance > Menus and create a Menu Item. Leave a # in place of the URL(this will avoid linking to anywhere else). Save your changes.
    Beamer WP tutorial step 3-1
  2. Go to the menu in your website (frontend) and over the new item you just created right-click and select Inspect (Google Chrome) or Inspect Element (Safari, Fire). You’ll see something like this.
    <ul id="primary-menu">
    	<li id="menu-item-1001">
    		<a href="">Leia</a>
    	<li id="menu-item-1208">
    		<a href="">Luke</a>
    	<li id="menu-item-7110">
    		<a href="">Han</a>
    	<li id="menu-item-9810">
    		<a href="">Chewie</a>
    	<li id="menu-item-1201">
    		<a href="#">R2</a>
  3. Search for the id value (something like this id="menu-item-2042") of the element you want to become your Beamer  button.
  4. Copy that value and paste it in the selector field in Beamer Settings at Settings > Beamer Settings.
    Beamer WP tutorial step 3-2
  5. Enjoy.WP tutorial screenshot


Your Data Security and Privacy is our Priority.

At Beamer, we care about our customers’ data and this is how we protect it.

Read our Terms of Service

vpn_key Data Ownership

Your account and data belongs to you and will not be sold in any case. We can delete your account and data upon your request. Learn more chevron_right

lock Encryption

Beamer data is encrypted in transit (advanced TLS protocols and 2,048-bit keys or better) and at rest (using AES 256 encryption with integrity).

dns Access

Customer data is always backed up and uptime is over 99.9%.

workspace_premium GDPR

Beamer is GDPR Compliant and has the Data Processing Agreements in place. Learn more chevron_right

bug_report Penetration testing

Third party network, application and physical security tests are conducted regularly. Learn more chevron_right

Keep your users in the know!