Instructions for Installing, Activating, and Using the “Custom Up Button” Plugin

Important Note: Compatibility

This plugin is compatible only with websites using the original Sellvia theme. If your website is not running on the original Sellvia theme, this plugin may not function as expected. Ensure that your WordPress site uses the Sellvia theme before proceeding with the installation.

Step 1: Install the Plugin

1. Download the Plugin ZIP File:
   • If you purchased the plugin, download the ZIP file from the source where you purchased it (e.g., the designCMP.com or our account of Buy Us a Coffee website).
2. Log in to Your WordPress Admin Dashboard:
   • Go to https://yourwebsite.com/wp-admin and log in using your credentials.
3. Navigate to the Plugins Section:
   • On the left sidebar, go to Plugins > Add New.
4. Upload the Plugin ZIP File:
   • Click the “Upload Plugin” button at the top of the page.
   • Click “Choose File,” select the custom-upbutton.zip file that you downloaded, and then click “Install Now.”
5. Activate the Plugin:
   • Once the plugin is installed, click the “Activate Plugin” button.

Step 2: Configure the Plugin Settings

1. Access the Plugin Settings:
   • After activating the plugin, navigate to Settings > Up Button Settings in the WordPress admin dashboard.
2. Add Images for Normal and Hover States:
   • Normal Image: Enter the URL for the image you want to display when the button is in its normal state. You can upload an image to your WordPress media library (via Media > Add New), copy the URL, and paste it here.
   • Hover Image: Enter the URL for the image you want to display when the button is hovered over. Use the same method to upload and copy the image URL from the media library.
3. Set Button Position (Left or Right):
   • Choose the position of the button on your website. Select either “Left” or “Right” from the dropdown menu based on where you want the button to appear.
4. Adjust Button Position in Pixels:
   • Up/Down Position (px): Enter the pixel value for the vertical position of the button. This value determines how far from the bottom of the screen the button will appear.
   • Left/Right Position (px): Enter the pixel value for the horizontal position. This value determines how far from the side (left or right, depending on your choice) the button will appear.
5. Save Changes:
   • Click the “Save Changes” button to apply the settings.

Step 3: Test the Plugin

1. Visit Your Website:
   • Open your website in a new tab and scroll down the page. You should see the “Up Button” appear according to the settings you configured.
2. Test the Button:
   • Click the button to ensure it scrolls to the top of the page as intended.
   • Hover over the button to verify that the hover image appears and the button position adjusts correctly.

Troubleshooting and Tips

• Image Not Showing Up: Ensure the image URLs entered in the settings are correct and accessible. You can test this by pasting the URL directly into your browser to see if the image loads.
• Button Not Working Properly: Check if there are any JavaScript errors on your site that might conflict with the plugin. You can use browser developer tools (F12 in most browsers) to inspect errors.
• Position Issues: If the button appears in an unexpected location, adjust the pixel values for “Up/Down” and “Left/Right” positions and save the settings again.
• Ensure You’re Using the Original Sellvia Theme: This plugin will only work correctly if your website is running the original Sellvia theme. If you’re using a different theme, consider switching to Sellvia or contacting support for alternative solutions.

Step 4: Customize Further (Optional)

• If you want to further customize the button’s appearance (e.g., size, color, additional styling), you can add custom CSS rules to your WordPress theme’s customizer (via Appearance > Customize > Additional CSS).

Step 5: Contact Support (If Needed)

• If you encounter any issues or have any questions about using the plugin, please contact support through the source where you purchased the plugin or refer to the documentation provided.

Important Note: Compatibility

This plugin is compatible only with websites using the original Sellvia theme. If your website is not running on the original Sellvia theme, this plugin may not function as expected. Ensure that your WordPress site uses the Sellvia theme before proceeding with the installation.

Step 1: Install the Plugin

1. Download the Plugin ZIP File:
   • If you purchased the plugin, download the ZIP file from the source where you purchased it (e.g., the designCMP.com or our account of Buy Us a Coffee website).
2. Log in to Your WordPress Admin Dashboard:
   • Go to https://yourwebsite.com/wp-admin and log in using your credentials.
3. Navigate to the Plugins Section:
   • On the left sidebar, go to Plugins > Add New.
4. Upload the Plugin ZIP File:
   • Click the “Upload Plugin” button at the top of the page.
   • Click “Choose File,” select the custom-upbutton.zip file that you downloaded, and then click “Install Now.”
5. Activate the Plugin:
   • Once the plugin is installed, click the “Activate Plugin” button.

Step 2: Configure the Plugin Settings

1. Access the Plugin Settings:
   • After activating the plugin, navigate to Settings > Up Button Settings in the WordPress admin dashboard.
2. Add Images for Normal and Hover States:
   • Normal Image: Enter the URL for the image you want to display when the button is in its normal state. You can upload an image to your WordPress media library (via Media > Add New), copy the URL, and paste it here.
   • Hover Image: Enter the URL for the image you want to display when the button is hovered over. Use the same method to upload and copy the image URL from the media library.
3. Set Button Position (Left or Right):
   • Choose the position of the button on your website. Select either “Left” or “Right” from the dropdown menu based on where you want the button to appear.
4. Adjust Button Position in Pixels:
   • Up/Down Position (px): Enter the pixel value for the vertical position of the button. This value determines how far from the bottom of the screen the button will appear.
   • Left/Right Position (px): Enter the pixel value for the horizontal position. This value determines how far from the side (left or right, depending on your choice) the button will appear.
5. Save Changes:
   • Click the “Save Changes” button to apply the settings.

Step 3: Test the Plugin

1. Visit Your Website:
   • Open your website in a new tab and scroll down the page. You should see the “Up Button” appear according to the settings you configured.
2. Test the Button:
   • Click the button to ensure it scrolls to the top of the page as intended.
   • Hover over the button to verify that the hover image appears and the button position adjusts correctly.

Troubleshooting and Tips

• Image Not Showing Up: Ensure the image URLs entered in the settings are correct and accessible. You can test this by pasting the URL directly into your browser to see if the image loads.
• Button Not Working Properly: Check if there are any JavaScript errors on your site that might conflict with the plugin. You can use browser developer tools (F12 in most browsers) to inspect errors.
• Position Issues: If the button appears in an unexpected location, adjust the pixel values for “Up/Down” and “Left/Right” positions and save the settings again.
• Ensure You’re Using the Original Sellvia Theme: This plugin will only work correctly if your website is running the original Sellvia theme. If you’re using a different theme, consider switching to Sellvia or contacting support for alternative solutions.

Step 4: Customize Further (Optional)

• If you want to further customize the button’s appearance (e.g., size, color, additional styling), you can add custom CSS rules to your WordPress theme’s customizer (via Appearance > Customize > Additional CSS).

Step 5: Contact Support (If Needed)

• If you encounter any issues or have any questions about using the plugin, please contact support through the source where you purchased the plugin or refer to the documentation provided.