Trending December 2023 # 10 Weebly Tweaks For Free Users – Webnots # Suggested January 2024 # Top 13 Popular

You are reading the article 10 Weebly Tweaks For Free Users – Webnots updated in December 2023 on the website Achiashop.com. We hope that the information we have shared is helpful to you. If you find the content interesting and meaningful, please share it with your friends and continue to follow and support us for the latest updates. Suggested January 2024 10 Weebly Tweaks For Free Users – Webnots

Weebly claims over 30 millions of users using their drag and drop platform for building websites. One of the important factors for Weebly’s success is to allow free users modify the source code. During recent days Weebly incorporated restrictions at the backend for free users. Still you can tweak your free site to take it to professional level. Here are 10 Weebly tweaks for free users to make your site professional and SEO friendly.

10 Weebly Tweaks for Free Users

Remove Free Weebly Footer

Add Scroll To Top Button

Add Favicon

Modify Source Code

Adding Custom CSS / Scripts

Verify Site with Google Search Console and Webmaster Tools

Integrate Google Analytics

Add Recent Posts with Blog Feed

Enable Disqus Commenting System

Add Font Icons

The first identification of a free Weebly site is the free footer at the bottom of your site. All free users can’t afford monthly subscription just to remove the footer. You can use simple CSS or script to disable the footer and add custom footer for your free Weebly site.

Remove Weebly Footer

Check out the article on how to remove free Weebly footer and add custom links.

2. Add Scroll To Top Button

Scroll to top or back to top button is an easy way for users to reach out top of the page. This is an useful function especially when you have lengthy content. You can simply use HTML text link with href attribute as “#top” to reach the top of the page.

If you want smooth scrolling effect then check out the article on how to add scroll to top button on Weebly site.

3. Add Favicon in Free Weebly Site

The favicon is the small icon shown on the browser tab. This is generally used for branding purpose, so that users will remember your site when multiple tabs are opened in the browser.

You can use custom favicon for your free site by following the guidelines on this article. Try using PNG or JPG image for your icon instead of ICO extension as Weebly overwrites the ICO icon.

4. Modify Source Code

The “Edit HTML / CSS” option allows you to access the source code editor. You can easily upload files and modify the layouts of your theme. It is also possible to completely upload a custom third party theme to use for your site. Learn more on how to edit source code of your Weebly site.

5. Adding Custom CSS / Script

CSS makes your site beautiful. There are many reasons you might be interested in adding custom CSS to your free Weebly site. You can do that in the following three ways:

Add CSS inline using Embed Code element

Add internally at page level

Add externally at site level

Check out the article to get complete details of how to add CSS in Weebly site. Similar to CSS, custom JavaScript can be added to your free Weebly site.

Similarly add Bing and any other search engine verification codes to verify the ownership of your Weebly site.

7. Integrate Google Analytics

Warning: Remember to paste the analytics code under header section and not under footer code section as Weebly recommends. If you paste under footer code section then Google will show you an error message to paste the code under header part of your pages.

8. Add Recent Posts with Blog Feed

Most of the users do not use the feed reader element offered by Weebly. This element can be placed anywhere on your page of blog sidebar to showcase the latest posts from your blog feed. You can also easily customize the feed reader element with simple CSS.

Choose Disqus Commenting System for Weebly Blog

10. Add Font Icons

There are two easy ways to use font icons on your free Weebly site. One is to down the font and CSS files and host on your site. Second is to add CDN link of the CSS to connect to external libraries. Learn how to use font awesome icons on Weebly site and you can use any other icons in similar manner. You can create beautiful full width sections with the combination of font icons, embed code and section elements.

You're reading 10 Weebly Tweaks For Free Users – Webnots

Add Multicolumn Drag And Drop Footer In Free Weebly Site – Webnots

In our previous article we explained how to remove free Weebly footer and add your own links in free Weebly site which may not be sufficient to have a professional looking site. Generally the footer should be with few columns having content which should appear site wide. But multiple column footer is a Weebly Pro feature and you need to upgrade to add drag and drop elements to your footer area. In this article we explain the step by step process of how to add multicolumn drag and drop footer in free Weebly site just by modifying the CSS and page HTML.

What are the Steps Involved?

Below are the steps involved in adding elements to your footer:

Step 1 – Accessing Site’s Source HTML/CSS

In Weebly editor select “Edit HTML/CSS” under “Design” tab.

In order to add a multiple column footer, you need to add the following CSS code in the “main_style.css” under “Assets” section. This code can be added anywhere in the CSS but add it with care to avoid over-lapping with another element.

/* Weebly Multi Column Drag and Drop Footer by WebNots*/ #multicolumnfooter{ width: 100%; color:#ffffff; font-size: 15px; text-align: center; padding: 10px 0px 10px 0px; margin: 10px; overflow-x: hidden; overflow-y: hidden; }

Customize the width, color, font, background and padding alignment to suit your site’s design. Also you can add additional styles to make the footer area more beautiful.

It should look like below after you added the code.

Step 3 – Modifying Page Layout HTML to Hide Existing Footer

Select the appropriate Page Layout as per your

page customization

under “Pages” tab. In this example the page is customized as “Standard Page” (no header image), hence the modification needs to be done in the page layout “no-header.html”.

If you have multiple page layouts in your site then do the changes in all page layouts. Otherwise some pages will show drag and drop footer and some pages will not show.

Browse through the HTML content and locate the {footer} code.

Different themes may have different type of footer code. Some themes may have footer-wrap which you need to hide as a whole. In general all themes should have {footer} tag mandatorily and you need to hide that.

Step 4 – Adding Multi Column Footer

Now that you have hided the existing footer and its time to add custom footer.

Add the below code just above the hidden footer element.

It should look like below after you have added the code:

Save your changes.

Step 5 – Drag and Drop Elements in Footer

Now you can drag and drop elements in the footer area in site editor like a pro users. Your site will look like a Weebly Pro site with a beautiful footer divided into multiple columns.

Below is an example of three column footer on a free Weebly site.

Adjust the footer margin with spacer element if the margin / padding provided in the CSS code is not effective.

4 Font Awesome Icons Widget For Weebly Site – Webnots

Icons widget helps to create an eye catching call to action panel and display any kind of information. Since there are huge icon sets available for free from various resources it is easy to showcase the needed information using a single attractive icon instead of describing with longer text. Especially font awesome icons are very good alternative to images in this context. In this article let us explore the process of creating font awesome icons widget for Weebly site.

Font Awesome Icons Widget for Weebly

Below is the widget (style 1) having 4 icons and you can add or remove the icons as you need.

Let us showcase further three more styles with variations:

Creating Icons Widget for Weebly Site

Let us take an example of creating a “Contact Us” widget with the following four options:

Send email

Call us

Chat now

Visit forum

This is a pure CSS widget where we convert simple list to an icon widget using font awesome icons. Each icons widget contains the following parts:

Panel container (this contains all 4 items)

Column – contains individual item

Article – containing an icon and a heading

Icon – font awesome icon

H2 heading which by default uses Weebly title element’s style.

Step 1 – Defining Styles for the Icons Widget

First we define the width of column as 21% so that 4 items can fit on your Weebly theme’s width. We have removed the bullets in the lists with “list-style:none” property and each list item will have some margin (bottom and left) with left floating. You can change all of these styles to suit on your layout. Note that we have used margin 20px to create space between list elements.

/* Individual Column */ .column { display:inline-block; float:left; margin:0 0 20px 20px; list-style:none; width:21%; }

Next we create panels with common background color as “lightgreen” along with styles for list elements (ul and li). We use “border-radius:10px;” for creating rounded corner for panels, remove this line if you want to show square icons.

/* Panel */ #panel { position:relative; z-index:1; } #panel ul li { text-align:center; border:1px solid; } #panel ul li *{ margin:0; padding:0; } #panel ul li .icon { margin-bottom:28px; } #panel ul li article { display:block; padding:30px 0 15px 0; } #panel ul li { color:#464646; background-color: lightgreen; border-color:#D7D7D7; border-radius: 10px; } #panel ul li a { color:inherit; } #panel ul li:hover a { color:#51C4BE; }

Next step is to define the styles for the font awesome icons as below. We have used the width and height of the icon buttons as 130px, border radius as 50% to make them circle and the size of the icon as 46px. You can remove the border radius to make the icons in square format and increase / decrease the size of the icon size by changing the font size attribute.

/* Button */ .icon { display:inline-block; } .icon i { position:relative; width:130px; height:130px; line-height:130px; z-index:1; } .icon i, .icon i::after { border-radius:50%; } .icon .fa { font-size:46px; } .icon i::after { position:absolute; top:15px; right:15px; bottom:15px; left:15px; border:1px solid; content:""; z-index:-1; } .icon i { color:#FFFFFF; background-color:#51C4BE;/* IE9 Fallback */ background:linear-gradient(to top right, #256D6A, #51C4BE); } .icon i::after { border-color:rgba(255,255,255,.5); } .icon:hover i::after { background-color:#51C4BE; } #panel ul li:hover .icon i { text-shadow:0 1px 0 #CCCCCC,0 2px 0 #333333,0 1px 0 #BBBBBB,0 4px 1px rgba(0,0,0,.1),0 0 5px rgba(0,0,0,.1),0 1px 3px rgba(0,0,0,.3),0 3px 5px rgba(0,0,0,.2),0 5px 10px rgba(0,0,0,.25) } #panel ul li:nth-child(1):hover .icon i::after { background-color:#F9CD36; /* Yellow */ } #panel ul li:nth-child(2):hover .icon i::after { background-color:#FF7659; /* Orange */ } #panel ul li:nth-child(3):hover .icon i::after { background-color:#9771BD;/* Purple */ } #panel ul li:nth-child(4):hover .icon i::after { background-color:#F36174;/* Red */ }

Yellow, orange, purple and red colors are used for the icons hover color which can also be changed as per your need. The last step in the CSS part of the widget is to add media queries to make the widget responsive on mobile devices.

/* Media Queries */ @media screen and (max-width:750px){ #panel ul li { display:inline-block; float:left; width:48.46625766871166%; margin:0 3.06748466257669% 15px 0;} #panel ul li:nth-child(even){ margin-right:0; clear:right; } } @media screen and (max-width: 450px){ #panel ul li { display: block; float: none; width: 95%; } } Step 2 – Adding CSS in Weebly Site Step 3 – Adding HTML Customizing Icons Widget

All the required styles are defined in the “icons_style.css” file which you can customize as per your need. We have added another three examples in the source download where we used inline styles to modify the required elements by keeping the “icons_style.css” as it is.

Use Icon Widget chúng tôi for different backgrounds for each panel.

Try Icon Widget chúng tôi for white background panels with different gradient color icons.

Use Icon Widget chúng tôi with social icons without panel border.

You can change the text / icons in HTML and refer the font awesome icons list for choosing the icon you need.

Top 10 Keyboard Shortcuts For Snagit For Mac – Webnots

Snagit is one of the top notch image capturing and video recording apps for Mac. Though you can use the default Screenshot app, processing of images need a quality app like Snagit. When using Snagit, you will be using certain functions like trimming the image frequently. Using keyboard shortcuts for such frequently used functions can save you lots of time.

Snagit Editor for Mac

Top 10 Keyboard Shortcuts for Snagit Mac 1. Command + Shift + O – Grab text from image

Do you know that Snagit has built-in tool for Optical Character Recognition? Yes, you can easily select the text portion on an image and grab the text with a keyboard shortcut. First, select a text on image using “Selection” tool and press “Command + Shift + O” keys. This will open a “Grab Text Results” box and show you the text content for you to copy.

Grab Text from Image

2. Command + Shift + X – Trim image

Sometimes your image may have plain white or no background beyond the required portions. Simply press, “Command + Shift + X” keys to trim the image and remove the outside portion.

3. Control + Shift + T – Flatten All

Snagit allows you to create image with multiple layers. This means you can copy and paste one image on another and bring to front or back to adjust. The layering also allows to drag each element on the image like text, stamps, etc. to move independently. When you are done with the complete image, press “Control + Shift + T” to flatten all parts and make it a single image.

4. Command + Shift + Z – Save as to Select Image Quality

Quality of an image highly depends on the type of extension you choose to save. PNG is good for high quality images with transparent background. However, you can’t adjust the image size with PNG. On other hand, JPEG allows equal quality with an option to adjust the image quality thus reducing the size. When your image is ready, press “Command + Shift + Z” shortcuts keys to open “Save As” menu.

Trim and Image Quality

Select, “jpg” option from the “Format” dropdown on the bottom of the pop-up. Now you will see a quality slider which you can slide to reduce the quality of the image. We recommend you choosing 60% to 70% quality for the instructional images used on webpages. Since webpages need to load each image as a separate HTTP request, this size reduction will help a lot in improving the page loading speed.

5. Command + , – Preferences to Set Keyboard Shortcuts

If you don’t like any of the existing keyboard shortcuts on Snagit, you can customize it from the preferences section. Press, “Command + ,” and open Snagit preferences section. Go to “Keyboard” tab to change the hot keys for the available shortcuts.

shows the shortcut keys to completely remove the shortcuts or assign the previously used one. If you have messed up the setup, press “Restore Shortcuts” to reset the shortcuts to app default.

6. Hold Shift – Select Square or Circle Portion

The selection tool on the toolbar helps you to grab a portion of the image. You can then copy, move, blur or do other stuffs with the selected portion. You can hold and drag the mouse pointer to select the portion as per the selection tool properties. The problem arises when you want to select a perfect square or circle portion. First select the rectangle option and simply hold the shift key when selecting with mouse. This will help you to precisely select square portion from the image.

Selection Tool Properties

If you want to select a perfect circle portion then change the selection tool to ellipse from the properties.

Bonus Tip: you can choose the background fill as “Auto-Fill”. This will help to retain the background when you drag a portion of an image.

7. Command + 1 – Image Library

When you have hundreds of images processed over time, you may need to navigate to the “Library” to choose previously processed images. Pressing” Command + 1” will simply take you to the “Library” from where you can search and find your old images.

8. Command + Option + T – Toggle Recent Capture Tray

Snagit will retain some of the previously captured images in the “Capture Tray”. You can quickly select the images from the tray. However, this tray occupy considerable bottom portion of the editor. When you want to increase the editor area, press “Command + Option + T” to hide the tray. You can again press the same keys to show the tray for image selection.

If the sidebar distracts your attention, press “Command + 4” to hide or show the sidebar that shows the properties and effects.

9. Command + ] or [

When you have large number of images on the capture tray, it is difficult to find the image you are currently processing. Sometimes, you also need to capture few images in sequence and go to the next or previous image for processing.

Press, “Command + ]” keys to highlight and select the next image.

Similarly, press “Command + [“ keys to highlight and select the previous image.

10. Control + R – Open Favorite Quick Styles

Snagit offers hundreds of can quickly collect all different styles like callout, text, arrows, stamps, etc. in a single place and use it quickly. For example, you don’t need to go to stamps and look for your favorite every time. Instead, add the stamp to favorite and use it quickly by using “Control + R” keyboard shortcuts.

Favorite Quick Styles

Final Words

Download Yahoo Mail App For Windows 10 For Free

How to Download Yahoo Mail App for Windows & Install Guide Everything you need to get the desktop app on your PC

292

The Yahoo! Mail app is no longer available for download in the Microsoft Store for some time now.

But there are still ways to use it on your Windows PC as we will show in this guide.

INSTALL BY CLICKING THE DOWNLOAD FILE

To fix Windows PC system issues, you will need a dedicated tool

Fortect is a tool that does not simply cleans up your PC, but has a repository with several millions of Windows System files stored in their initial version. When your PC encounters a problem, Fortect will fix it for you, by replacing bad files with fresh versions. To fix your current PC issue, here are the steps you need to take:

Download Fortect and install it on your PC.

Start the tool’s scanning process to look for corrupt files that are the source of your problem

Fortect has been downloaded by

readers this month.

Yahoo Mail is one of the most used email apps thanks to its excellent features. However, users are used to using the web client on Windows PC, which makes it hard to get notifications.

To make things easier and get the full package, you need to download the Yahoo Mail app for Windows. This guide will show you the easiest ways to do it quickly.

Is there a Yahoo Mail app for Windows?

Yahoo Mail used to have a dedicated app for Windows PC but discontinued it for some reason. At some point, there was a u-turn, and the app sprang up again on the Windows Store.

But at this time of writing, the Yahoo Mail app is no longer available in the Store. Thankfully, there are some ways around using the email client, as shown in the ensuing section of this article.

How do I download the Yahoo Mail app on my PC?

As stated earlier, The Yahoo Mail app is no longer available for download in the Microsoft Store or any official source. The reason is that Yahoo! officially discontinued the app.

Aside from official sources, even third-party websites do not have the app available for download. However, you can still access your web client on your browser.

Alternatively, you can consider another email client in Mailbird to get the full experience you want in the app. This great mail client app will centralize and let you easily manage your Yahoo! Inbox.

This said, not only do you get all your emails and contacts from multiple accounts in one single place. Mailbird also supports integration with other useful apps like Google Calendar, Twitter, or Asana so that you can easily manage all your tasks from the same app.

In terms of productivity, the app allows you to snooze messages for later to focus only on urgent emails, plus it lets you add customizable notifications sounds.

⇒ Get Mailbird

That is all there is to know about downloading the Yahoo Mail app on Windows PC. With the information in this guide, you should know how to work around the app.

If you need a list of the best email clients for Windows PC, you can check our detailed guide for the best options to choose.

Still experiencing issues?

Was this page helpful?

Best Free Benchmark Software For Windows 11/10

If you have installed Windows 11, you might want to see how the different components of your computer are working. If you have Windows 10 and Windows 11 side by side on different machines, you may install these best free benchmark programs to see which operating system is better. Windows has an inbuilt Memory Diagnostic Tool. But if you are looking for more feature-rich software, these may interest you.

Benchmark Software for Windows 11/10

Here is a list of some of the best free benchmarking software for Windows 11/10 PC:

SiSoft Sandra Lite

Unigine Game Benchmark – Heaven

Unigine Game Benchmark – Valley

Novabench

FurMark

PC-Wizard

CrystalDisk.

1] SiSoft Sandra Lite

SiSoft Sandra has always been a favorite program to test computers since Windows XP was released. The SiSoft Sandra is a paid program as such, but there is a lite version that is free. Though the lite version does not offer all the features of the paid version, it still offers too many features to be neglected. Some of the main features of SiSoft Sandra Lite for Windows 10 are GPU cryptography testing, Media Transcoding testing, and Blue Ray testing.

Benchmarking not only tells you what components are doing good, but they also hint which computer parts have to be worked upon. For example, if the GPU card marks are too low, you may consider changing it for better performance. Thus, benchmarking is not only for reviewers. Anyone can use the SiSoft Sandra Free Lite for Windows 10 easily as the interface is self-explanatory.

Media Transcoding benchmarking is a good asset to have. It tells you how fast and easily your computer programs convert videos or audio from one format to another. Based on the performance test, you can change the program and again run the benchmark. Play around a bit and pick up the program that converts without problems and takes up the least time in conversion.

Likewise, the GPU benchmark helps you consider if the current card is good enough for games or if you need to change the card for a better gaming experience.

One of the best things about SiSoft Sandra Lite is that you have access to a huge database of different hardware benchmarks. You can compare your benchmark results with other hardware manually and go for better computer components if the need arises.

During installation, this tool will download and install DirectX if required – which in turn offers to install the Bing Bar. This is a 90MB download, and if your computer does not have it, it will be required.

TIP: You can test your processor using Intel Processor Diagnostics Tool.

2] Unigine Game Benchmark – Heaven

The program is actually a game engine. Heaven offers you a benchmark system that tells you the state of your computer. You can compare it with other computers of other players and check if you need to upgrade your computer. This offers a fun way of benchmarking your Windows 11/10 computer. You can also chat with others while the benchmark programs start printing the results on the screen of your monitor. Go take a look at it here.

Read: What does PC Benchmark mean?

3] Unigine Game Benchmark – Valley

The Unigine game engine also contains Valley, a benchmark for testing the GPU stress. It pushes the state of the art technology to push video cards to their limits and sees how they handle the stress. This test helps you check how your video card works when you are playing games: does it crash, does it slow down or can it handle the stress well. Again, you can compare it with the huge database of other results to see if there are better video cards and if you wish, you can upgrade to them. More on this here.

There are many other benchmark programs out there, but not all are compatible with Windows 10 yet. They might take a month or two to upgrade themselves. Meanwhile, you can use the above three benchmarks. If you ask me, I would highly recommend SiSoft Sandra Lite as it is not only free but does a great job. Who knows you might even find out more features than I could. Give it a try and let us know your experiences.

Here are some more PC benchmarking software:

Some of you might want to take a look at these PC Stress Test freeware too.