內容簡介
總結文案: Smart Social Media Buttons是在WordPress上添加可定制且響應式社交媒體按鈕的最簡單方法。
### 問題與答案:
1. 這個WordPress外掛的主要功能是什麼？
- 主要功能是讓使用者輕鬆在WordPress上添加可定制和響應式的社交媒體按鈕。
2. 使用這個外掛可以添加社交媒體按鈕的位置有哪些？
- 可以將可定制的社交媒體按鈕添加到頁面、側邊欄和頁腳作為區塊或小部件。
3. 如何自定義按鈕的設計？
- 可以調整按鈕的大小、顏色、對齊方式和滑鼠懸停效果，使用使用者友好的介面進行設置。
4. 如何在按鈕上添加自定義連結？
- 可以為每個按鈕添加獨特的鏈接，並選擇在新分頁中打開連結，並添加連結屬性，如nofollow進行SEO優化。
5. 這個外掛的使用方法是怎樣的？
- 打開區塊編輯器或在WordPress自定義器的小工具部分中尋找“Smart Social Media Buttons”，將其插入所需位置，並使用設置面板進行配置。
外掛標籤
開發者團隊
原文外掛簡介
Smart Social Media Buttons – The easiest way to add customizable, responsive social media buttons to WordPress.
Key Features:
– Flexible Integration: Add customizable social media buttons as blocks or widgets to pages, sidebars, and footers.
– Built-in Icon Picker: Use the integrated FontAwesome icons or upload custom SVGs with ease.
– Customizable Designs: Adjust button size, color, alignment, and hover effects using the user-friendly interface.
– Custom Links: Add unique links to each button, with options to open links in a new tab and add link attributes like nofollow for SEO optimization.
– One-Click Style Copying: Seamlessly copy and paste button styles across different blocks to maintain design consistency.
– Responsive & Mobile-Friendly: Optimized for desktops, tablets, and mobile devices to ensure a seamless user experience across all screens.
– No Coding Required: Effortlessly customize layout, styles, icons, and more with easy-to-use settings.
– Performance-Optimized: Efficiently loads resources to keep your WordPress site running smoothly, without impacting performance.
– Flexible Hover Effects: Add animations such as scale, lift, darken, blink, rotate, and more to create engaging interactions.
– Enhanced User Experience: Manage button settings through an intuitive right-sidebar panel or toolbar, offering a streamlined editing process.
Usage Instructions
Adding the Widget:
Open the Block Editor or navigate to the Widgets section in the WordPress Customizer.
Search for “Smart Social Media Buttons” and insert it into the desired location (page, post, sidebar, or footer).
Configure the widget using the settings panel, adjusting layouts, styles, and alignments as needed.
Uploading Custom SVGs:
In the widget’s settings panel, click the Upload SVG button.
Choose an SVG file from your computer and customize its size, color, and other attributes.
Adding Links to Icons:
Enter the desired URL in the settings panel for each social media button.
Choose options such as opening links in a new tab and specifying rel attributes for better SEO control.
Using the Icon Picker:
Search for any icon in the Icon Picker and select it from the list.
You can add or change icons directly from the toolbar panel.
Adding Links in the Toolbar:
Use the Add Link button in the toolbar panel to add or edit links for your icons.
Adjust link attributes like opening in a new tab and adding rel values directly from the panel.
Setting up Responsive Controls:
Customize settings for desktop, tablet, and mobile devices to ensure optimal display across all screen sizes.
Using Different Backgrounds:
Choose between solid, gradient, or image backgrounds in the settings sidebar, making it easy to match your website’s style.
Copy and Paste Styles:
Use the Copy Styles button in the toolbar to copy CSS styles of a button.
Use the Paste Styles button to apply the copied styles to another button.
Note: Only CSS styles are copied; icons and links are not transferred.
Development Instructions
For developers looking to make modifications or rebuild the plugin from source, follow the steps below:
Setup
Install Dependencies: Ensure you have Node.js installed on your machine.
Run the following command in the plugin’s root directory to install dependencies:
npm install
Build the Plugin for Production:
npm run build – this command will generate the minified files in the build folder
Start Development Mode (Optional):
npm run start – this command will watch for changes in your source files and recompile them automatically
Update Packages (Optional):
npm run packages-update – update WordPress packages to the latest versions
Starting with WordPress 6.7, it is recommended to set __nextHasNoMarginBottom = { true } on components such as BaseControl, ToggleControl, TextControl and RangeControl to ensure compatibility with upcoming changes in WordPress 7.0.
Compatibility
WordPress Version: Tested with 6.1, compatible with newer versions.
PHP Version: 7.0 and above recommended.
Browsers: Compatible with major browsers (Chrome, Firefox, Safari, Edge).
Themes: Designed to work with most WordPress themes; minor adjustments may be required for styling.
Support and Documentation
For support, please reach out to us at [email protected]. We aim to respond within 24-48 hours during business days.
For more information on how to use the plugin, refer to the included user documentation (PDF) in the plugin package.
Support includes:
– Assistance with installation and setup.
– Help with configuring plugin features.
– Guidance on troubleshooting common issues.
Support does not include:
– Custom development or major modifications.
– Troubleshooting third-party conflicts.
FontAwesome Attribution
FontAwesome Free icons are integrated under the SIL OFL 1.1, CC BY 4.0, and MIT licenses. Proper attribution is provided in the plugin code. Learn more about the FontAwesome Free license here.
Credits
This plugin uses FontAwesome Free, licensed under SIL OFL 1.1, CC BY 4.0, and MIT licenses.
WordPress contributors for inspiration and guidance.
Privacy and Data Collection
This plugin does not collect, store, or transmit any user data to external servers. It only uses cookies for necessary functionality and does not track users.
