fbpx

Pages

Calendar

It’s easy to add a Google calendar to any website with Elementor.

  1. Open Google Calendar, and get the code to embed it in your website
  2. In the top right, click Settings Settings and then Settings.
  3. On the left side of the screen, click the name of the calendar you want to embed.
  4. In the “Integrate this calendar” section, copy the iframe code displayed.
  5. Choose your options, then copy the HTML code displayed.
  6. Make sure your embedded calendar is set as public.
  7. Inside Elementor, drag the HTML widget, and paste the embed code of the calendar.

Archives

Audio

Image

Images play a vital role in web design, so you will most likely use the Image Widget a lot while designing your website. Let’s go over all of the settings you can control for this widget.

Content

  1. Image – Upload an image or choose Dynamic to dynamically use Posts featured image, Site Logo, and Author Profile Picture.
  2. Image Size – Choose the size of the image
  3. Alignment – Set the image Alignment
  4. Caption – Optionally, add a caption to the bottom of the image. Choose to either create a new custom caption or use the current Attachment Caption from the image’s location in the WordPress Media Library.
  5. Link To – Set a link to a custom URL, media file, or no link. Choose “media file” to link directly to the location of the image within your media library. Choose “custom URL” to link to any page on any site. Choose “none” if you don’t want to add a link to the image at all.

Style

  1. Width – Set the Image Width
  2. Max Width – Set the Max Width for the Image
  3. Hover Animation – Click the dropdown to choose a Hover Animation
  4. CSS Filters – Set CSS Filters: Blur, Brightness, Contrast and Saturation
  5. Opacity – Set the Opacity
  6. Transition Duration – Set the Hover Animation duration
  7. Border Type – Set a Border Type
  8. Border Radius – Set a Border Radius
  9. Box Shadow – Set Box Shadow: Horizontal, Vertical, Blur, and Spread
  10. Caption – Set the Alignment, Text color, Text Shadow, and Typography of the caption.

Advanced

Set the Advanced options that are applicable to this widget

Gallery

The Basic Gallery Widget allows you to easily add and style beautiful image galleries on your page.

Content

Image Gallery

  1. Click Add Image button to select images to display. Once selected, click Create a New Gallery button and then click the Insert Gallery button.
  2. Image Size: Choose the size of the image, from thumbnail to full
  3. Columns: Set the number of columns to display, from 1 to 10
  4. Link to: Link images to their respective Media Files, Attachment Pages, or None (Media File must be selected if Lightbox is enabled)
  5. Lightbox: Choose to display images in a lightbox. If Yes or No is chosen, that selection will override the Global Default Lightbox setting. Images will only appear in lightbox if Media File is selected as the Link to: option.
  6. Ordering: Choose Default or Random ordering of images within the gallery

Style

Images

  1. Spacing: Set the spacing between slides. Choose Default (20px) or Custom (The Spacing option is only available if more than 1 is chosen for Slides to Show on Content tab)
  2. Border Type: Set the type of border, choosing from None, Solid, Double, Dotted, Dashed, or Groove
  3. Border Radius: Set the border radius, to control corner roundness

Caption

  1. Display: Hide or Show Captions (If captions are shown, the following additional options are available)
  2. Alignment: Align caption left, right, center, or justified
  3. Text Color: Select the color of the caption text
  4. Typography: Set the typography settings of the caption text

Advanced

Set the Advanced options that are applicable to this widget

Video

Use the Video Widget to easily embed videos on your page.

Video

  1. Source: Select the source of the video. Choose between Youtube, Vimeo, Dailymotion, or Self Hosted (which includes hosting on external servers)
  2. URL: Enter the URL of the video
  3. Start / End Time: Set Start and End time for your video. Leave blank for full length video

Video Options

Youtube

  1. Autoplay: Slide to YES to automatically play the video on page load
  2. Play on Mobile: This option only appears if Autoplay is set to Yes. Useful to allow iOS to autoplay the video.
  3. Mute: Slide to YES to Mute the video
  4. Loop: Slide to YES to Loop the video
  5. Player Controls: Show or Hide the Player Controls, such as Play/Pause, Volume, etc.
  6. Modest Branding: When Player Controls is set to YES, you can Hide the YouTube logo by sliding Modest Branding slider to YES
  7. Suggested Videos: Choose from “Current Video Channel” or “Any Video”
  8. Privacy Mode: Slide ON or OFF. When ON, Youtube won’t store information about visitors on your website unless they play the video

Vimeo

  1. Autoplay: Slide to YES to automatically play the video on page load
  2. Mute: Slide to YES to Mute the video
  3. Loop: Slide to YES to Loop the video
  4. Controls Color: Choose the color of the Player Controls, such as Play/Pause, etc.
  5. Intro Title: Show or Hide the Intro Title
  6. Intro Portrait: Show or Hide the Intro Portrait
  7. Intro Byline: Show or Hide the Intro Byline

Dailymotion

  1. Autoplay: Slide to YES to automatically play the video on page load
  2. Mute: Slide to YES to Mute the video
  3. Player Controls: Show or Hide the Player Controls, such as Play/Pause, Volume, etc.
  4. Video Info: Show or Hide the Video Info, such as the video’s title
  5. Logo: Show or Hide the Video Logo
  6. Controls Color: Choose the color of the Player Controls, such as Play/Pause, etc.

Self Hosted

  1. Autoplay: Slide to YES to automatically play the video on page load
  2. Mute: Slide to YES to Mute the video
  3. Loop: Slide to YES to Loop the video
  4. Player Controls: Show or Hide the Player Controls, such as Play/Pause, Volume, etc.
  5. Download Button: Show or Hide the Download Button (applicable for Chrome only)

Image Overlay

Image Overlay: Show or Hide an Image Overlay

If Image Overlay is set to Yes, the following options become available:

  1. Image: Set your Image
  2. Lazy Load: Defer loading of the video resources until the user clicks the Play button *
  3. Image Size: Set your Image Size
  4. Play Icon: Slide to YES to show a Play Icon
  5. Lightbox: Slide ON to view the video in a Lightbox. Once ON, you will have to set an image

Lazy Load replaces the video embed code with a static image of your choice, and optionally, a play icon on top of the static image. The video is only loaded when the user clicks on the image.
This greatly helps speed up the initial page load time because the user’s browser doesn’t download the many extra resources Youtube and other video services embed, all before a user even needs them. If you want faster load times on pages that embed videos, Lazy Load is a good option to enable.

Style

  1. Aspect Ratio: Change the videos aspect ratio. Choices include: 1:1, 3:2, 4:3, 16:9, 21:9, and 9:16
  2. CSS Filters: Set up a blur, brightness, contrast, saturation, and hue

Advanced

Set the Advanced options that are applicable to this widget

 

 

Meta

Search

The Search Form widget allows you to add a search bar anywhere on your website.

Content

Search Form

  1. Skin: Choose classic, minimal or full-screen pre-built styles
  2. Placeholder: Set the text that appears inside the search form

Button or Toggle

  1. Type: Choose to display an Icon or Custom Text on the button
  2. Icon or Text: If using an icon on the button, choose from a search or arrow icon. If using custom text, specify the text that will appear on the button
  3. Size: Adjust the size of the button or search icon
  4. Alignment (for full-screen skin only): Align the search icon to the left, center, or righ

Style

Input

  1. Overlay Color (for Full Screen skin only): Select the color of the full screen overlay
  2. Typography: Change the typography options of the search bar for both normal and focused modes
  3. Text color: Choose the color of the text
  4. Background color: Choose the background color
  5. Border color: Choose the border color
  6. Box-shadow: Give the search bar a box shadow
  7. Border size: Control the thickness of the border
  8. Border radius:  Set the border radius to control corner roundness

Button or Toggle

  1. Text color: Choose the color of the text
  2. Background color: Choose the background color of the button
  3. Icon size: Scale the icon size up and down
  4. Width: Adjust the width of the button
  5. Border Width: Control the thickness of the border
  6. Border Radius: Set the border radius to control corner roundness

Note: The Search Form widget uses standard WordPress site search functionality. It does not include a typeahead / autocomplete feature.

Advanced

Set the Advanced options that are applicable to this widget

Text

Categories

Recent Posts

Recent Comments

RSS

Tag Cloud

“Tilted Tag Cloud Widget” is a free plugin for WordPress, developed by the Whiletrue.it staff to generate a cloud with the website’s most used tags.

The words inside the cloud are overlapping and tilted, creating a cluster.

  1. Upload the tilted-tagcloudwidget directory into the /wp-content/plugins/ directory.
  2. Activate the plugin through the Plugins menu in WordPress.
  3. Inside the Themes->Widget menu, place the Tilted Tag Cloud Widget inside a sidebar, customize the settings and save.
  4. Enjoy!

Navigation Menu

Custom HTML

Cart

Active Product Filters

Filter Products By Attribute

Filter Products By Price

Product Categories

Product Search

Product Tag Cloud

Products

Recent Viewed Products

Products By Rating

Recent Product Reviews

Filter Products By Rating

Copyright @ 2020 |  | Koperasi Al-Najah (K.L) Berhad

Chinese (Simplified) Chinese (Simplified) English English Malay Malay