22 posts
I previously used Alibaba Cloud OSS for personal image hosting, but as the number of posts and images grew and site traffic increased, image-hosting bandwidth also rose and costs kept climbing. So I looked for another platform and found that Cloudflare R2 can provide 10 GB of storage and 10 million free read requests per month.
I now publish blog posts on CSDN and my own website at the same time. However, I used to write and publish directly in the CSDN editor, which was an uncomfortable way to work. I still prefer a local Markdown editor such as Typora. This means I need my own image host, so screenshots pasted into the local Markdown editor are automatically uploaded to it.
Most examples online show a Fork me on GitHub ribbon, but the principle for implementing Follow me on CSDN is the same. Just download and edit the image for the effect you want, upload it to an image host (or CSDN), obtain the image URL, and replace the URL in the code.
Since the NexT theme has been updated several times, many resources said to modify the custom.styl configuration file. However, my theme did not contain this file. After consulting a great deal of material, I finally found the location of the sidebar configuration file.
In Hexo, there are generally two _config.yml files—one in the root directory, which I call the site configuration file, and one in the theme directory, which I call the theme configuration file. This article covers settings such as theme switching, menu configuration, sidebar configuration, author avatar, social links, site name, author name, Chinese/English switching, number of posts shown on the homepage, and translation settings.
First, create the Categories and Tags pages as described below. Then, create a .md file in the source\_posts directory to create a new blog post. Add the following code at the beginning of the post to assign categories and tags; the annotations explain the purpose of each section.
An element can move freely within a box and overlap other boxes. When the window is scrolled, some modules stay fixed at a certain position on the screen. Neither of these effects can be achieved quickly with standard flow or floats alone; positioning is needed in those cases.
Emmet was formerly known as Zen Coding. It uses abbreviations to speed up HTML/CSS coding, and VS Code has built-in support for it.
CSS provides three traditional layout methods—normal flow (standard flow), floats, and positioning. All three are used to arrange boxes. Once the boxes are placed in the appropriate positions, the layout naturally takes shape. In actual development, a page generally includes all three layout methods (mobile devices have newer layout methods).
Web page layout learning has three core topics—the box model, floats, and positioning. Learning the box model helps us lay out pages well. The web page layout process: first prepare the related page elements, use CSS to set the box styles, then place them in the corresponding positions, and put content into the boxes.
CSS classifies selectors by type as basic selectors and composite selectors. Composite selectors are built by combining basic selectors. CSS background properties can add background styles to elements on a page, including background colors, images, tiling, image positions, and fixed background images.
CSS is mainly used to beautify web pages and lay them out. Web pages look unattractive when only HTML is used. CSS is also a markup language, mainly used to set the text content (font, size, alignment, etc.), the appearance of images (width and height, border styles, margins, etc.), and the layout and visual styles of HTML pages.
HTML is a language used to describe web pages. HTML stands for HyperText Markup Language. HTML is not a programming language; it is a markup language. How to use HTML headings, paragraphs, links, and images. Elements, attributes, and formatting; links, styles, and tables; how to create lists, blocks, layouts, and forms.
I tried using PicGo on Ubuntu, but every time I installed a plugin, it prompted me to install Node.js. Following the installation steps did not solve the issue, so I reinstalled Node.js.
Building a website requires a server and a domain name. This article covers the entire process of purchasing a server, registering a domain name, configuring the server, installing WordPress, and successfully setting up a blog, as a reference.
First, prepare by installing the Elementor plugin, a theme, and supporting plugins; then import a template and visually edit the site with Elementor; finally, update the site navigation in the WordPress admin dashboard.
In WordPress, content is mainly divided into two parts, posts and pages. WordPress plugins can add, modify, or remove functionality from a WordPress site. The Media Library is mainly used to manage attachments uploaded through WordPress, such as images, videos, and other files.
For the 413 Request Entity Too Large issue, nginx limits the upload size. The solution is as follows: 1. Open the nginx configuration file nginx.conf, usually located at: /etc/nginx/nginx.conf. 2. Add client_max_body_size 64m; to the http{} section. 64m is the maximum allowed upload size. 3. Save the file and restart nginx with service nginx restart
When entering the admin dashboard/working in the admin dashboard, you may find that the page loads very slowly. One reason is that WordPress uses Google Fonts. Solution: install the Disable Google Fonts plugin (personally tested and confirmed working in 2021.1). (Research suggests another cause is that user avatars fail to load properly, but this has already been fixed in the latest version of WordPress.)
After WordPress has been installed and configured, you can access the website by entering localhost or the Raspberry Pi's IP address in a browser. However, it still cannot be accessed from the external network (outside the same router). The purpose of NAT traversal is to allow computers on the external network to access your website. To make the setup less difficult and complex, I used PeanutHull.
Download the installation package from the official WordPress website, extract it, and place the contents of the worpress folder in the html folder. Enter localhost/phpmyadmin in your browser to open phpMyAdmin, enter your phpMyAdmin username and password, click the Databases tab, create a new database, enter a database name, and click Create. No database tables are needed for now.
Setting up a personal website on a Raspberry Pi mainly involves the following steps—setting up a LAMP server (Linux + Apache + MySQL + PHP) and creating a database user (this step requires installing PhpMyAdmin and using SQL statements to add a MariaDB database user).
