A method and device for creating a page

By monitoring user operations and calling pre-encapsulated anchor codes, visualization of the page editing interface is realized, and the problems of high cost of page creation and difficult to personalize in the existing technology are solved, and the efficiency and flexibility of page editing are improved.

CN112559935BActive Publication Date: 2024-12-24BEIJING SANKUAI ONLINE TECH CO LTD
View PDF 10 Cites 0 Cited by

Patent Information

Application Number
CN202011479733.X
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2020-12-15
Publication Date
2024-12-24
Estimated Expiration
2040-12-15

AI Technical Summary

Technical Problem

In the prior art, merchants on e-commerce platforms can only use default pages or restricted page templates to adjust when creating pages, which is difficult to meet personalized needs, and it is costly to write page code directly and difficult to achieve.

Method used

By monitoring the user's operations on the page editing interface, calling the server's pre-encapsulated anchor code, adding anchor tags and content containers, and displaying them in the content container according to the business module, visual editing and personalized customization of the page are realized.

Benefits of technology

It lowers the threshold and cost of creating pages, improves the efficiency and flexibility of page editing, and allows users to avoid mastering page code writing skills, realizing personalized page customization.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN112559935B_ABST
    Figure CN112559935B_ABST
Patent Text Reader

Abstract

This specification discloses a method and device for creating a page, which provides a user with a visual preview of a page to be edited through a page editing interface, calls the anchor code pre-packaged by the server according to the user's anchor creation operation, determines the anchor tag, content container and the mapping relationship between the anchor tag and the content container, adds the control of the anchor tag in the tag bar of the page to be edited, adds the content container in the content area of ​​the page to be edited, and then adds and displays the corresponding business module in the content container according to the business module selected by the user. Calling the packaged code according to the user operation and displaying the created content in the previewed page to be edited allows the user to create a page anchor even if he does not have code writing skills, which lowers the threshold for creating pages, meets the needs of personalized pages, improves efficiency and reduces costs.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present application relates to the field of computer technology, and in particular to a method and device for creating a page. Background Art

[0002] At present, with the development of the Internet, e-commerce platforms emerge in an endless stream, and online businesses are becoming more and more mature. In online scenarios, merchants usually need to register on e-commerce platforms and create their own corresponding pages, so that users can complete online business through the merchant's page, and merchants can use their own pages to display products, provide services, and conduct publicity and other functions.

[0003] Due to the characteristics of online business, users can only understand the merchant's situation through the merchant's page. Therefore, in order to avoid being homogenized with other competitors and to display information according to demand, merchants have the need to create personalized pages.

[0004] However, in the prior art, merchants can only use the default page provided by the e-commerce platform, make limited adjustments, or select a page template from several page templates provided by the e-commerce platform to create a page. The former adjustment usually does not change the page layout, and the latter template can only contain a limited number of page layouts, which usually cannot meet the needs of merchants. If you create a page directly from the page code, it is not realistic for most merchants. Usually, you can only outsource it to a third party for writing and creation, which is not only costly but also difficult to meet the requirements of merchants.

[0005] Therefore, this specification provides a method and device for creating a page to solve the problems existing in the prior art. Summary of the invention

[0006] The embodiments of this specification provide a method and device for creating a page, which are used to partially solve the problems existing in the prior art.

[0007] The embodiments of this specification adopt the following technical solutions:

[0008] The method for creating a page provided in this manual includes:

[0009] Monitoring the user's operation in a page editing interface, wherein the page editing interface displays a page to be edited for preview, wherein the page to be edited includes at least: a tab bar and a content area;

[0010] According to the monitored anchor creation operation of the user, a call request is sent to a server to obtain a pre-packaged anchor code stored in the server, wherein the anchor code includes a pre-created anchor tag, a content container corresponding to the anchor tag, and a mapping relationship between the anchor tag and the content container;

[0011] Adding a control of the anchor tag in the tab bar of the page to be edited, and determining the position of the area corresponding to the content container in the content area of ​​the page to be edited;

[0012] According to the business module selected by the user, the business module is added to the area corresponding to the content container for display.

[0013] Optionally, according to the monitored anchor point creation operation of the user, sending a call request to the server to obtain a pre-packaged anchor point code stored in the server, specifically includes:

[0014] Determining that an anchor creation operation is monitored according to an operation of the user on a tag creation control in the page editing interface;

[0015] According to the anchor point creation operation, a call request is sent to the server, so that the server determines the stored pre-packaged anchor point code according to the call request;

[0016] receiving the stored pre-packaged anchor code returned by the server;

[0017] According to a preset tag naming rule, the created anchor tags and the content containers corresponding to the anchor tags, the initial values ​​of the anchor tags in the anchor code are sequentially determined;

[0018] According to the initial value of the anchor tag, a code of a content container corresponding to the anchor tag and a mapping relationship between the anchor tag and the content container are determined.

[0019] Optionally, adding a control of the anchor tag in the tab bar of the page to be edited, and determining the position of the area corresponding to the content container in the content area of ​​the page to be edited specifically includes:

[0020] Determine a default control identifier of the anchor tag according to the control identifier of the anchor tag displayed on the page to be edited and a preset order of the control identifiers;

[0021] According to the existing controls in the tab bar, sequentially add the controls of the anchor tag in the tab bar, so that the tab bar of the page to be edited displays the controls of the anchor tag and their default control identifiers;

[0022] According to the area corresponding to the existing content container in the content area of ​​the page to be edited, the position of the area corresponding to the content container corresponding to the anchor tag is determined in sequence, and the area corresponding to the content container is added at the position, so that the content area of ​​the page to be edited displays the area corresponding to the content container.

[0023] Optionally, the method further comprises:

[0024] According to the user's editing operation on the anchor tag and the text information input by the user, updating the control identifier of the anchor tag in the tag bar of the page to be edited;

[0025] According to the established mapping relationship between the anchor tag and the content container and the updated control identifier, adjusting the identifier of the content container in the content area of ​​the page to be edited;

[0026] Update the anchor code according to the updated control ID and content container ID.

[0027] Optionally, the method further comprises:

[0028] According to the user's dragging operation on the controls in the tab bar of the page to be edited, adjusting the arrangement order of the controls in the tab bar of the page to be edited, and updating the code of the page to be edited; or

[0029] According to the user's dragging operation on the area corresponding to the content container in the content area of ​​the page to be edited, the position of the area corresponding to the content container in the content area of ​​the page to be edited is re-determined, and the code of the page to be edited is updated.

[0030] Optionally, the page editing interface further includes: a module list, where different business modules in the module list are used to implement different page functions;

[0031] According to the business module selected by the user, the business module is added to the area corresponding to the content container for display, specifically including:

[0032] Determine, according to the user's dragging operation on the business module in the module list, a content container for adding the business module;

[0033] According to the module layout of the content container, the business module is added to the content container, and the business module is displayed in the area corresponding to the content container in the page to be edited;

[0034] According to the business module displayed by the content container, the code of the page to be edited is updated.

[0035] Optionally, the method further comprises:

[0036] Determining, according to the user's operation, the anchor tag selected by the user;

[0037] According to the anchor tag selected by the user, the control of the anchor tag and the area corresponding to the content container corresponding to the anchor tag are highlighted in the page to be edited.

[0038] Optionally, the method further comprises:

[0039] Determining that a completion operation is detected based on the monitored operation of the user on the edit completion control in the page editing interface;

[0040] The code of the page to be edited is determined according to the position of the anchor tag included in the anchor code of the page to be edited, the position of the content container, and the corresponding relationship between the anchor tag and the content container.

[0041] The device for creating a page provided in this specification includes:

[0042] A monitoring module monitors the user's operation in the page editing interface, wherein the page to be edited is displayed in the page editing interface for preview, and the page to be edited includes at least: a tab bar and a content area;

[0043] a code acquisition module, which sends a call request to a server according to the monitored anchor creation operation of the user, so as to obtain a pre-packaged anchor code stored in the server, wherein the anchor code includes a pre-created anchor tag, a content container corresponding to the anchor tag, and a mapping relationship between the anchor tag and the content container;

[0044] A display module, which adds a control of the anchor tag in the tag bar of the page to be edited, and determines the position of the area corresponding to the content container in the content area of ​​the page to be edited;

[0045] The content adding module adds the business module to the area corresponding to the content container for display according to the business module selected by the user.

[0046] A computer-readable storage medium stores a computer program, wherein the computer program implements any of the above methods when executed by a processor.

[0047] The electronic device provided in this specification includes a memory, a processor, and a computer program stored in the memory and executable on the processor, and the processor implements any of the above-described methods when executing the program.

[0048] At least one of the above technical solutions adopted in the embodiments of this specification can achieve the following beneficial effects:

[0049] When the user is editing a page, a visual preview of the page to be edited is provided to the user through the page editing interface, and according to the user's anchor creation operation, the pre-packaged anchor code of the server can be called to determine the anchor tag, content container and the mapping relationship between the anchor tag and the content container, and the control of the anchor tag is added to the tag bar of the page to be edited, and the content container is added to the content area of ​​the page to be edited. Then, according to the business module selected by the user, the corresponding business module is added to the content container and displayed. When the user's anchor creation operation is detected, the packaged anchor code is called and the content corresponding to the anchor code is displayed in the previewed page to be edited. The process of anchor creation is visualized through the page editing interface, so that the user does not need to master the skills of page code writing, and can also conveniently add anchors to the page when editing and creating the page without relying on a third party, which reduces the threshold for users to create pages, while ensuring the needs of personalized and flexible pages, improving the efficiency of page creation, and reducing the cost of page creation. BRIEF DESCRIPTION OF THE DRAWINGS

[0050] The drawings described herein are used to provide a further understanding of the present application and constitute a part of the present application. The illustrative embodiments of the present application and their descriptions are used to explain the present application and do not constitute an improper limitation on the present application. In the drawings:

[0051] Figure 1 A schematic diagram of the page creation process provided in the embodiments of this specification;

[0052] Figure 2 A schematic diagram of a page editing interface provided in an embodiment of this specification;

[0053] Figure 3 A schematic diagram showing a created anchor tag provided in an embodiment of this specification;

[0054] Figure 4 A schematic diagram of changes in a page to be edited provided in an embodiment of this specification;

[0055] Figure 5 A schematic diagram of the structure of a page creation device provided in an embodiment of this specification;

[0056] Figure 6 A schematic diagram of an electronic device for implementing a page creation method provided in an embodiment of this specification. DETAILED DESCRIPTION

[0057] In order to make the purpose, technical solutions and advantages of this specification more clear, the technical solutions of this application will be clearly and completely described below in combination with the specific embodiments of this specification and the corresponding drawings. Obviously, the described embodiments are only part of the embodiments of this application, not all of them. Based on the embodiments in this specification, all other embodiments obtained by ordinary technicians in this field without creative work are within the scope of protection of this application.

[0058] The technical solutions provided by various embodiments of the present application are described in detail below in conjunction with the accompanying drawings.

[0059] Figure 1 The schematic diagram of the process of creating a page provided in the embodiment of this specification includes:

[0060] S100: Monitoring the user's operations in the page editing interface.

[0061] In one or more embodiments of this specification, the user can be a merchant on an e-commerce platform or a user on a social platform. In fact, as long as there is a need for a personalized editing interface, the method for creating a page provided in this specification is applicable. For example, a merchant on an e-commerce platform needs to edit a merchant's page, and a user on a social platform needs to edit a personal homepage, etc. For the convenience of description, this specification will be described later using an example of a merchant on an e-commerce platform editing a merchant's page, that is, the user in this specification can be regarded as a merchant staff member who is responsible for editing and creating a merchant page.

[0062] Generally, since the merchant who edits the page is not a full-time user who writes page codes, but is only a user who uses the page editing service, the user can access the server that provides page editing through the terminal, and the server can return the page used to edit the page to the terminal, which displays the page editing interface. Therefore, in this specification, the process of creating the page can be executed by the user's terminal, and the terminal can specifically be a mobile phone, tablet computer, personal computer and other devices, as long as the terminal can display the page editing interface and the user can operate in the page editing interface to edit the page to be edited. After displaying the page editing interface, the terminal can monitor the user's operations in the page editing interface, and determine the page edited by the user based on the monitored user operations, and generate the code corresponding to the page, without requiring the user to directly edit the page code.

[0063] In this manual, the page editing interface can be used as follows Figure 2 As shown. The page editing interface is the interface used by users to edit pages, which avoids users from facing the unintuitive scenario of writing codes, but presents the editing effect of the page to users through a visual interface.

[0064] Figure 2 This is a schematic diagram of the page editing interface provided in this manual, which includes a page to be edited for previewing the editing effect. In addition, in order to enable users to add anchor tags during page editing without having to learn how to add anchor tags in page code editing, the page editing interface also includes an anchor content area for creating anchors, which includes buttons for creating anchors, namely, Figure 2 and a business module list for adding business modules to the content container, that is, Figure 2 The area corresponding to the active module on the left. Users can edit the page by pressing the buttons on the page editing interface or operating the business module. Figure 2 The anchor content area may also include a button for deleting the anchor tag, that is, Figure 2 The "-" symbol key in the text box can also display the number of anchor tags currently created. Figure 2 0 is displayed in the figure, which means that no anchor tags have been created yet. In the figure, (0 / X) means that the maximum number of anchor tags that can be created is X, and 0 is the number of anchor tags currently created. Figure 2 The Preview button in the dialog box is used to display the preview effect of the page to be edited, the Save button is used to save the edited content, and the Done button is used to generate page code based on the edited page content and publish it to the server.

[0065] In addition, in this specification, the page to be edited displayed in the page editing interface includes at least: a tab bar and a content area, wherein the tab bar is an area of ​​the page for placing controls for anchor tags, and the content area is an area of ​​the page for placing various page elements. Page elements may include: images, text, video, audio, etc., or other more complex page elements. This specification does not limit what specific page elements can be placed. Of course, the page elements contained in the content containers corresponding to different anchor identifiers can be restricted by the business module, that is, Figure 2 As shown, in the page editing interface, you can add anchor tags and business modules.

[0066] S102: According to the monitored anchor creation operation of the user, a call request is sent to a server to obtain a pre-packaged anchor code stored in the server, wherein the anchor code includes a pre-created anchor tag and a content container corresponding to the anchor tag, and a mapping relationship between the anchor tag and the content container is established.

[0067] In one or more embodiments of the present specification, when the terminal detects the user's anchor creation operation, it can send a call request to the server, so that the server determines the stored pre-packaged anchor code and returns the anchor code to the terminal. The terminal can then add the anchor tag contained in the anchor code to the page code according to the received anchor code, as well as the code for creating a content container corresponding to the anchor tag, and the code for the mapping relationship between the anchor tag and the content container.

[0068] Specifically, in the present specification, the terminal may send a call request to the server when detecting the user's operation on the key to create an anchor in the page editing interface. The server may then return the stored pre-packaged anchor code to the terminal based on the call request. The pre-packaged anchor code includes the code of the anchor tag, the code of the content container corresponding to the anchor tag, and the code of the mapping relationship between the anchor tag and the content container. Furthermore, since the specific naming of the anchor tag needs to be determined based on the requirements when writing the page, the pre-packaged anchor code stored by the server can be regarded as a template for the anchor code, that is, the necessary code in the anchor code. As for data that needs to be assigned according to the page status, such as the name of the anchor tag, it can be determined by the terminal according to the tag naming rules after receiving the anchor code. Figure 2 For example, when the terminal detects that the user clicks the "+" symbol button, it can send a call request to the server, receive the anchor code returned by the server, determine the anchor tag code and the corresponding content container code, as well as the code that describes the mapping relationship between the two.

[0069] In addition, when creating a page, users usually do not set only one anchor tag, but usually set multiple anchor tags, corresponding to content containers at different locations in the page, so that when browsing the page, they can quickly access different locations in the page through the page's tab bar and quickly obtain the required information.

[0070] Therefore, in this specification, in order to distinguish different anchor tags, when receiving a pre-packaged anchor tag, the terminal can determine the initial value of the anchor tag in sequence according to the already created anchor tags and the content containers corresponding to each anchor tag, according to the preset tag naming rules, and based on the initial value of the anchor tag, determine the code of the content container corresponding to the anchor tag and the code of the mapping relationship between the anchor tag and the content container. As mentioned above, the pre-packaged anchor code can be regarded as a template of the anchor code. At this time, determining the initial value of the anchor tag is equivalent to completing the code of the anchor tag, the code of the content container, and the code of the mapping relationship in the anchor code.

[0071] For example, assuming that the default naming rule of the anchor tag is "label" + "sequential number", the initial value of the anchor tag created by default is: label 01, label 02, label 03... arranged in sequence. Similarly, since the content container corresponds to the anchor tag, in order to facilitate the mapping relationship between the content container and the anchor tag, the anchor tag contained in the code of the content container can also be determined by the same method. Alternatively, the terminal can also create the code of the content container and reuse the anchor tag after creating the anchor tag.

[0072] In addition, in order to facilitate the user to determine which anchor tags have been created, in this manual, the page editing interface can also display the created anchor tags in the order in which the anchor tags were created, such as Figure 3 shown. Figure 3 The schematic diagram provided for this manual shows the created anchor tags. It can be seen that several anchor tags are arranged below the button for creating anchors, and each anchor tag is named according to the above naming rules. Tag 01 is an already created anchor tag, so the page to be edited contains the corresponding controls and content containers. Tag 02 is created according to user operations, and the corresponding controls and content containers have not yet been rendered on the page to be edited.

[0073] It should be noted that the above-mentioned anchor tag naming process is for the page code level, that is, the initial value of the anchor tag determined according to the tag naming rules is only displayed in the page code, while the name edited by the user is displayed in the page to be edited. The specific content is explained in the following step S104.

[0074] S104: Adding a control of the anchor tag in the tag bar of the page to be edited, and determining a position of a corresponding area of ​​the content container in the content area of ​​the page to be edited.

[0075] In this specification, after the terminal determines the anchor tag and its corresponding content container contained in the anchor code, it can add the control of the anchor tag in the tag bar of the page to be edited, determine the position of the area corresponding to the content container in the content area of ​​the page to be edited, and add the content container in the area of ​​the position. This allows the user to intuitively determine whether the created anchor tag meets his requirements through the page to be edited, and continue to edit the anchor tag or content container.

[0076] Specifically, first, the terminal can determine the default control identifier of the anchor tag according to the control identifier of the anchor tag that has been created and the preset order of each control identifier. Similar to the naming rules described in step S102, the control corresponding to the anchor identifier displayed in the page to be edited also needs to set the corresponding control identifier, that is, the name actually displayed in the page. In this manual, the preset control identifiers can be set according to the scene corresponding to the page, of course, this manual does not limit this. For example, in the e-commerce platform, the preset control identifiers can be sorted as: home page, category, selection, discount, etc., which are common names in the page tag bar of the e-commerce platform, and their order can also be set as needed. At this time, the content of the code of the anchor tag in the anchor code includes: the initial value of the anchor tag, and the control identifier of the control corresponding to the anchor tag.

[0077] Secondly, the terminal can sequentially add the controls of the anchor tag in the tab bar according to the existing controls in the tab bar, so that the tab bar of the page to be edited displays the controls of the anchor tag and their default control identifiers, such as Figure 4 shown. Figure 4 This is a schematic diagram of the page changes to be edited provided in this manual. Figure 4 It can be seen that the user has added two anchor tags in the page to be edited, namely tags 01 and 02, corresponding to the controls in the tab bar of the page to be edited. The control identifiers from left to right are: Home and Offers. After executing step S102 to add a new anchor tag, the terminal displays tag 03 in the page editing interface, and adds the control "Featured" in sequence in the tab bar of the page to be edited.

[0078] Finally, the terminal can sequentially determine the position of the content container corresponding to the anchor tag according to the area corresponding to the existing content container in the content area of ​​the page to be edited, and add the content container corresponding area at the position, so that the content area of ​​the page to be edited displays the area corresponding to the content container, such as Figure 4 shown. Figure 4 The area where the content container is located includes content containers corresponding to the two anchor tags that have been created. After executing step S102, the content container corresponding to the newly created anchor tag is added sequentially after the above two content containers.

[0079] In addition, in this manual, the default control identification usually cannot meet user needs. Therefore, the terminal can also determine the control whose identification the user needs to modify based on the user's editing operation on the created anchor label. The specific editing operation can be set as needed. For example, when a double-click operation of the control is detected, it is determined to edit the control and enter the editing state of the control identification.

[0080] The terminal may update the control identifier of the created anchor tag in the tag bar of the page to be edited according to the text information input by the user.

[0081] Similarly, the terminal can adjust the identifier of the content container in the content area of ​​the page to be edited according to the mapping relationship between the established anchor tag and the content container and the updated control identifier. This allows the user to determine the mapping relationship according to the control identifier and the content container identifier. In addition, the terminal can also update the anchor code according to the updated control identifier and the content container identifier.

[0082] Furthermore, when the number of anchor tags added by the user is large, the mapping relationship between the anchor tags and the content container is relatively complex. When writing in code, the user needs to remember all the mapping relationships and the page elements added in the content container, which makes it easy for errors to occur in the page code writing. The visual interface provided by this manual not only lowers the threshold and improves efficiency when adding and editing anchor tags. At the same time, since the anchor codes are pre-packaged, there will be no errors in writing code.

[0083] At the same time, in order to avoid editing errors and omissions caused by the complexity of the mapping relationship, such as the user modifying the wrong control identifier and needing to modify the page repeatedly, in this specification, the terminal can also monitor the user's selection operation on the tab bar, content container, or anchor tag in the page editing interface to be edited, and highlight it, so that when the user selects any of the above tab bar, content container and anchor tag, the terminal can highlight the other two related items in the page editing interface. This allows the user to determine which control is currently being modified and which content container it corresponds to.

[0084] For example, when a user selects an anchor tag, the corresponding controls and content containers in the page to be edited will also be highlighted, allowing the user to clearly and intuitively determine the status of the page editing, such as Figure 4 Highlighted tab 03, the corresponding tab bar control, and the content container.

[0085] It should be noted that the process of determining the anchor tag, content container, and mapping relationship in step S102 of this specification, and the process of adding controls to add content containers in step S104, the above two processes may not be in a particular order. According to the anchor creation operation, you can first add controls to add content containers, and then create the corresponding code. That is to say, adding controls to add content containers may not be rendered according to the created page code. Instead, it is rendered according to a pre-set template. After rendering the page to obtain a preview image, create the page code that can obtain the preview image.

[0086] Furthermore, since users usually have high demands for personalization, the default settings are usually edited and updated, so the terminal can also determine to create the page code after the user completes the editing. When the user is editing, the content of the page is rendered only according to the user input and operation.

[0087] S106: According to the service module selected by the user, the service module is added to the area corresponding to the content container for display.

[0088] In one or more embodiments of the present specification, due to the setting of the anchor tag, because there is a lot of content in the page, it is set for the convenience of accessing the content located in different positions, so the page elements added by different content containers are generally not exactly the same. In the present specification, the page editing interface may also include a module list, and different business modules in the module list are used to implement different page functions.

[0089] The terminal can also add the business module selected by the user to the area corresponding to the content container for display, so that the user can determine the effect of the page creation in a visual manner.

[0090] Specifically, the terminal can determine the content container to add the business module according to the user's dragging operation on the business module in the module list, that is, the user can drag the business module to the area where any content container is located, and the terminal can determine which business module the user needs to add to which content container by detecting the dragging operation. Then, the terminal can also add the business module to the content container according to the module layout of the content container, and display the business module in the area corresponding to the content container in the page to be edited. Finally, according to the business module displayed by the content container, the code of the page to be edited is updated. Among them, the module layout of the content container can be determined according to the business module that the user has dragged to the content container. This process can refer to the existing mobile terminal's method of adjusting the position of the desktop picture, and it is already relatively mature, so this manual will not go into details.

[0091] In one or more embodiments of the present specification, the user may repeat the above steps S102 to S106 to edit the page. After repeatedly performing steps S102 to S106, the user obtains the desired page.

[0092] Furthermore, in this specification, the user can operate the "Finish" button in the page editing interface, and the terminal can determine that the page to be edited has been edited based on the user's completion operation monitored, and determine the page code based on the code of the created anchor tag, the code of the content container, and the mapping relationship between the two. After the page code is determined, if a URL is assigned and deployed to the server, other users can obtain the page through the URL, realizing the complete process of page creation and deployment.

[0093] It should be noted that the various codes described above are used to allow any terminal to display the content of the page to be edited by running the code. For example, the code of the anchor tag includes the name of the anchor tag, the position of the control in the tab bar, the control identifier, and other content.

[0094] based on Figure 1 The page creation method shown provides a visual preview of the page to be edited to the user through the page editing interface when the user is editing the page, and can call the anchor code pre-packaged by the server according to the user's anchor creation operation, determine the anchor tag, content container and the mapping relationship between the anchor tag and the content container, and add the control of the anchor tag in the tag bar of the page to be edited, add the content container in the content area of ​​the page to be edited, and then add the corresponding business module in the content container according to the business module selected by the user and display it. When the user's completion operation is detected, the code of the page to be edited is determined and the corresponding page is created. When the user's anchor creation operation is detected, the packaged anchor code is called and the content corresponding to the anchor code is displayed in the previewed page to be edited. The process of anchor creation is visualized through the page editing interface, so that the user does not need to master the skills of page code writing, and can also conveniently add anchors to the page when editing and creating the page without relying on a third party, which reduces the threshold for users to create pages, while ensuring the needs of personalized and flexible pages, improving the efficiency of creating pages, and reducing the cost of creating pages.

[0095] In addition, the present specification provides one or more embodiments, similar to the terminal adjusting the content of the page to be edited according to the user operation described in step S104, the terminal can also adjust the arrangement order of the controls in the tab bar of the page to be edited according to the user's dragging operation on the controls in the tab bar of the page to be edited. Or, according to the user's dragging operation on the corresponding area of ​​the content container in the content area of ​​the page to be edited, the position of the corresponding area of ​​the content container in the content area of ​​the page to be edited is re-determined. Moreover, the terminal can update the code of the page to be edited according to the position change of the controls or content containers, so that the positions of the controls and content containers in the page rendered according to the code of the page to be edited conform to the user's editing results.

[0096] Furthermore, in step S102 of the present specification, the pre-packaged anchor code provided by the server can also determine the initial value of the automatically generated anchor tag of the current anchor tag according to the call request sent historically by the terminal and the tag naming rule, and then return the anchor code with the initial value added to the terminal. In other words, there is no need for the terminal to complete the numerical value in the anchor code, but the code returned by the server is already a complete code. In addition, because the server can determine the initial value of the anchor tag according to the call request sent historically and the tag naming rule, it can be ensured that the initial value of the anchor tag returned to the terminal each time is different, avoiding the possibility of code conflicts.

[0097] based on Figure 1 The page creation process shown in the figure, the embodiment of this specification also provides a structural schematic diagram of a page creation device, such as Figure 5 shown.

[0098] Figure 5 A schematic diagram of the structure of a page creation device provided in an embodiment of this specification, wherein the device includes:

[0099] A monitoring module 200 monitors the user's operation in a page editing interface, wherein the page to be edited is displayed in the page editing interface for preview, and the page to be edited includes at least: a tab bar and a content area;

[0100] The code acquisition module 202 sends a call request to the server according to the monitored anchor creation operation of the user to obtain the pre-packaged anchor code stored in the server, wherein the anchor code includes a pre-created anchor tag, a content container corresponding to the anchor tag, and a mapping relationship between the anchor tag and the content container;

[0101] The display module 204 adds a control of the anchor tag in the tag bar of the page to be edited, and determines the position of the corresponding area of ​​the content container in the content area of ​​the page to be edited;

[0102] The content adding module 206 adds the service module to the area corresponding to the content container for display according to the service module selected by the user.

[0103] Optionally, the code acquisition module 202 determines that an anchor creation operation is detected based on the user's operation on the tag creation control in the page editing interface, and sends a call request to the server based on the anchor creation operation, so that the server determines the stored pre-packaged anchor code based on the call request, receives the stored pre-packaged anchor code returned by the server, and sequentially determines the initial value of the anchor tag in the anchor code based on a preset tag naming rule, the created anchor tags, and the content containers corresponding to the anchor tags, and determines the code of the content container corresponding to the anchor tag and the code of the mapping relationship between the anchor tag and the content container based on the initial value of the anchor tag.

[0104] Optionally, the display module 204 determines the default control identifier of the anchor tag based on the control identifier of the anchor tag displayed on the page to be edited and the preset order of each control identifier, sequentially adds the controls of the anchor tag in the tab bar based on the existing controls in the tab bar, so that the tab bar of the page to be edited displays the controls of the anchor tag and its default control identifier, sequentially determines the position of the area corresponding to the content container corresponding to the anchor tag based on the area corresponding to the existing content container in the content area of ​​the page to be edited, and adds the area corresponding to the content container at the position, so that the content area of ​​the page to be edited displays the area corresponding to the content container.

[0105] Optionally, the content adding module 206 updates the control identifier of the anchor tag in the tab bar of the page to be edited according to the user's editing operation on the anchor tag and the text information input by the user, adjusts the identifier of the content container in the content area of ​​the page to be edited according to the established mapping relationship between the anchor tag and the content container and the updated control identifier, and updates the anchor code according to the updated control identifier and the identifier of the content container.

[0106] Optionally, the content adding module 206 adjusts the arrangement order of controls in the tab bar of the page to be edited and updates the code of the page to be edited according to the user's dragging operation on the controls in the tab bar of the page to be edited; or re-determines the position of the corresponding area of ​​the content container in the content area of ​​the page to be edited and updates the code of the page to be edited according to the user's dragging operation on the corresponding area of ​​the content container in the content area of ​​the page to be edited.

[0107] Optionally, the page editing interface also includes: a module list, in which different business modules in the module list are used to implement different page functions, and the content adding module 206 determines the content container to add the business module according to the user's dragging operation of the business module in the module list, adds the business module to the content container according to the module layout of the content container, and displays the business module in the area corresponding to the content container in the page to be edited, and updates the code of the page to be edited according to the business module displayed in the content container.

[0108] Optionally, the display module 204 determines the anchor tag selected by the user according to the user's operation, and highlights the control of the anchor tag and the area corresponding to the content container corresponding to the anchor tag in the page to be edited according to the anchor tag selected by the user.

[0109] Optionally, the device also includes: a page creation module 208, which determines that a completion operation is detected based on the user's operation on the editing completion control in the page editing interface, and determines the code of the page to be edited based on the position of the anchor tag contained in the anchor code of the page to be edited, the position of the content container, and the correspondence between the anchor tag and the content container.

[0110] The embodiments of the present specification also provide a computer-readable storage medium, which stores a computer program. The computer program can be used to execute any one of the above-mentioned methods for creating a page.

[0111] based on Figure 1 The page creation process provided in this specification also proposes Figure 6 The schematic structure diagram of the electronic device shown in FIG. Figure 6 At the hardware level, the electronic device includes a processor, an internal bus, a network interface, a memory and a non-volatile memory. The processor reads the corresponding computer program from the non-volatile memory into the memory and then runs it to implement any of the above-mentioned page creation methods.

[0112] Of course, in addition to software implementation, this specification does not exclude other implementation methods, such as logic devices or a combination of software and hardware, etc., that is to say, the executor of the following processing flow is not limited to each logic unit, but can also be hardware or logic devices.

[0113] In the 1990s, improvements to a technology could be clearly distinguished as hardware improvements (for example, improvements to the circuit structure of diodes, transistors, switches, etc.) or software improvements (improvements to the method flow). However, with the development of technology, many improvements to the method flow today can be regarded as direct improvements to the hardware circuit structure. Designers almost always obtain the corresponding hardware circuit structure by programming the improved method flow into the hardware circuit. Therefore, it cannot be said that an improvement in a method flow cannot be implemented using a hardware entity module. For example, a programmable logic device (PLD) (such as a field programmable gate array (FPGA)) is such an integrated circuit whose logical function is determined by the user's programming of the device. Designers can "integrate" a digital system on a PLD by programming it themselves, without having to ask a chip manufacturer to design and produce a dedicated integrated circuit chip. Moreover, nowadays, instead of manually making integrated circuit chips, this kind of programming is mostly implemented by "logic compiler" software, which is similar to the software compiler used when developing and writing programs, and the original code before compilation must also be written in a specific programming language, which is called hardware description language (HDL). There is not only one HDL, but many kinds, such as ABEL (Advanced Boolean Expression Language), AHDL (Altera Hardware Description Language), Confluence, CUPL (Cornell University Programming Language), HDCal, JHDL (Java Hardware Description Language), Lava, Lola, MyHDL, PALASM, RHDL (Ruby Hardware Description Language), etc. The most commonly used ones are VHDL (Very-High-Speed ​​Integrated Circuit Hardware Description Language) and Verilog. Those skilled in the art should also know that it is only necessary to program the method flow slightly in the above-mentioned hardware description languages ​​and program it into the integrated circuit, and then it is easy to obtain the hardware circuit that implements the logic method flow.

[0114] The controller can be implemented in any appropriate manner, for example, the controller can take the form of a microprocessor or processor and a computer-readable medium storing a computer-readable program code (such as software or firmware) that can be executed by the (micro)processor, a logic gate, a switch, an application-specific integrated circuit (ASIC), a programmable logic controller, and an embedded microcontroller. Examples of controllers include, but are not limited to, the following microcontrollers: ARC 625D, Atmel AT91SAM, Microchip PIC18F26K20, and Silicone Labs C8051F320. The memory controller can also be implemented as part of the control logic of the memory. Those skilled in the art also know that in addition to implementing the controller in a purely computer-readable program code manner, the controller can be implemented in the form of a logic gate, a switch, an application-specific integrated circuit, a programmable logic controller, and an embedded microcontroller by logically programming the method steps. Therefore, this controller can be considered as a hardware component, and the devices included therein for implementing various functions can also be regarded as structures within the hardware component. Or even, the devices for implementing various functions can be regarded as both software modules for implementing the method and structures within the hardware component.

[0115] The systems, devices, modules or units described in the above embodiments may be implemented by computer chips or entities, or by products with certain functions. A typical implementation device is a computer. Specifically, the computer may be, for example, a personal computer, a laptop computer, a cellular phone, a camera phone, a smart phone, a personal digital assistant, a media player, a navigation device, an email device, a game console, a tablet computer, a wearable device, or a combination of any of these devices.

[0116] For the convenience of description, the above device is described in various units according to their functions. Of course, when implementing this specification, the functions of each unit can be implemented in the same or multiple software and / or hardware.

[0117] Those skilled in the art will appreciate that embodiments of the present invention may be provided as methods, systems, or computer program products. Therefore, the present invention may take the form of a complete hardware embodiment, a complete software embodiment, or an embodiment combining software and hardware. Moreover, the present invention may take the form of a computer program product implemented on one or more computer-usable storage media (including but not limited to disk storage, CD-ROM, optical storage, etc.) containing computer-usable program code.

[0118] The present invention is described with reference to flowcharts and / or block diagrams of methods, devices (systems), and computer program products according to embodiments of the present invention. It should be understood that each process and / or block in the flowchart and / or block diagram, as well as the combination of processes and / or blocks in the flowchart and / or block diagram, can be implemented by computer program instructions. These computer program instructions can be provided to a processor of a general-purpose computer, a special-purpose computer, an embedded processor, or other programmable data processing device to produce a machine, so that the instructions executed by the processor of the computer or other programmable data processing device generate instructions for implementing the processes in the flowchart and / or block diagram. Figure 1 A process or multiple processes and / or boxes Figure 1 A device that provides the functions specified in a block or multiple blocks.

[0119] These computer program instructions may also be stored in a computer-readable memory capable of directing a computer or other programmable data processing device to operate in a specific manner, so that the instructions stored in the computer-readable memory produce an article of manufacture comprising an instruction device, which implements the process Figure 1 A process or multiple processes and / or boxes Figure 1 A function specified in one or more boxes.

[0120] These computer program instructions can also be loaded onto a computer or other programmable data processing device so that a series of operating steps are executed on the computer or other programmable device to produce a computer-implemented process, thereby providing instructions for implementing the process. Figure 1 A process or multiple processes and / or boxes Figure 1 The steps for the functions specified in one or more boxes.

[0121] In a typical configuration, a computing device includes one or more processors (CPU), input / output interfaces, network interfaces, and memory.

[0122] The memory may include non-permanent storage in a computer-readable medium, random access memory (RAM) and / or non-volatile memory in the form of read-only memory (ROM) or flash RAM. The memory is an example of a computer-readable medium.

[0123] Computer readable media include permanent and non-permanent, removable and non-removable media that can be implemented by any method or technology to store information. Information can be computer readable instructions, data structures, program modules or other data. Examples of computer storage media include, but are not limited to, phase change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), other types of random access memory (RAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), flash memory or other memory technology, compact disk read-only memory (CD-ROM), digital versatile disk (DVD) or other optical storage, magnetic cassettes, magnetic tape magnetic disk storage or other magnetic storage devices or any other non-transmission media that can be used to store information that can be accessed by a computing device. As defined herein, computer readable media does not include temporary computer readable media (transitory media), such as modulated data signals and carrier waves.

[0124] It should also be noted that the terms "include", "comprises" or any other variations thereof are intended to cover non-exclusive inclusion, so that a process, method, commodity or device including a series of elements includes not only those elements, but also other elements not explicitly listed, or also includes elements inherent to such process, method, commodity or device. In the absence of more restrictions, the elements defined by the sentence "comprises a ..." do not exclude the existence of other identical elements in the process, method, commodity or device including the elements.

[0125] Those skilled in the art will appreciate that the embodiments of this specification may be provided as methods, systems or computer program products. Therefore, this specification may take the form of a complete hardware embodiment, a complete software embodiment or an embodiment combining software and hardware. Moreover, this specification may take the form of a computer program product implemented on one or more computer-usable storage media (including but not limited to disk storage, CD-ROM, optical storage, etc.) containing computer-usable program code.

[0126] This specification may be described in the general context of computer-executable instructions executed by a computer, such as program modules. Generally, program modules include routines, programs, objects, components, data structures, etc. that perform specific tasks or implement specific abstract data types. This specification may also be practiced in distributed computing environments where tasks are performed by remote processing devices connected through a communication network. In a distributed computing environment, program modules may be located in local and remote computer storage media, including storage devices.

[0127] Each embodiment in this specification is described in a progressive manner, and the same or similar parts between the embodiments can be referred to each other, and each embodiment focuses on the differences from other embodiments. In particular, for the system embodiment, since it is basically similar to the method embodiment, the description is relatively simple, and the relevant parts can be referred to the partial description of the method embodiment.

[0128] The above description is only an embodiment of the present specification and is not intended to limit the present specification. For those skilled in the art, the present specification may have various changes and variations. Any modification, equivalent replacement, improvement, etc. made within the spirit and principle of the present specification shall be included in the scope of the claims of the present specification.

Claims

1. A method for creating a page, characterized in that: include: Monitoring the user's operation in a page editing interface, wherein the page editing interface displays a page to be edited for preview, wherein the page to be edited includes at least: a tab bar and a content area; According to the monitored anchor creation operation of the user, a call request is sent to a server to obtain a pre-packaged anchor code stored in the server, wherein the anchor code includes a pre-created anchor tag, a content container corresponding to the anchor tag, and a mapping relationship between the anchor tag and the content container; Adding a control of the anchor tag in the tab bar of the page to be edited, and determining the position of the area corresponding to the content container in the content area of ​​the page to be edited; According to the business module selected by the user, the business module is added to the area corresponding to the content container for display.

2. The method according to claim 1, characterized in that According to the monitored anchor point creation operation of the user, a call request is sent to the server to obtain a pre-packaged anchor point code stored in the server, specifically including: Determining that an anchor creation operation is monitored according to an operation of the user on a tag creation control in the page editing interface; According to the anchor point creation operation, a call request is sent to the server, so that the server determines the stored pre-packaged anchor point code according to the call request; receiving the stored pre-packaged anchor code returned by the server; According to a preset tag naming rule, the created anchor tags and the content containers corresponding to the anchor tags, the initial values ​​of the anchor tags in the anchor code are sequentially determined; According to the initial value of the anchor tag, a code of a content container corresponding to the anchor tag and a code of a mapping relationship between the anchor tag and the content container are determined.

3. The method according to claim 1, characterized in that Adding a control of the anchor tag in the tab bar of the page to be edited, and determining a position of a corresponding area of ​​the content container in the content area of ​​the page to be edited, specifically includes: Determine a default control identifier of the anchor tag according to the control identifier of the anchor tag displayed on the page to be edited and a preset order of the control identifiers; According to the existing controls in the tab bar, sequentially add the controls of the anchor tag in the tab bar, so that the tab bar of the page to be edited displays the controls of the anchor tag and their default control identifiers; According to the area corresponding to the existing content container in the content area of ​​the page to be edited, the position of the area corresponding to the content container corresponding to the anchor tag is determined in sequence, and the area corresponding to the content container is added at the position, so that the content area of ​​the page to be edited displays the area corresponding to the content container.

4. The method according to claim 1, characterized in that The method further comprises: According to the user's editing operation on the anchor tag and the text information input by the user, updating the control identifier of the anchor tag in the tag bar of the page to be edited; According to the established mapping relationship between the anchor tag and the content container and the updated control identifier, adjusting the identifier of the content container in the content area of ​​the page to be edited; Update the anchor code according to the updated control ID and content container ID.

5. The method according to claim 1, characterized in that The method further comprises: According to the user's dragging operation on the controls in the tab bar of the page to be edited, adjusting the arrangement order of the controls in the tab bar of the page to be edited, and updating the code of the page to be edited; or According to the user's dragging operation on the area corresponding to the content container in the content area of ​​the page to be edited, the position of the area corresponding to the content container in the content area of ​​the page to be edited is re-determined, and the code of the page to be edited is updated.

6. The method according to claim 1, characterized in that The page editing interface also includes: a module list, in which different business modules are used to implement different page functions; According to the business module selected by the user, the business module is added to the area corresponding to the content container for display, specifically including: Determine, according to the user's dragging operation on the business module in the module list, a content container for adding the business module; According to the module layout of the content container, the business module is added to the content container, and the business module is displayed in the area corresponding to the content container in the page to be edited; According to the business module displayed by the content container, the code of the page to be edited is updated.

7. The method according to claim 1, characterized in that The method further comprises: Determining, according to the user's operation, the anchor tag selected by the user; According to the anchor tag selected by the user, the control of the anchor tag and the area corresponding to the content container corresponding to the anchor tag are highlighted in the page to be edited.

8. The method according to claim 1, characterized in that The method further comprises: Determining that a completion operation is detected based on the monitored operation of the user on the edit completion control in the page editing interface; The code of the page to be edited is determined according to the position of the anchor tag included in the anchor code of the page to be edited, the position of the content container, and the corresponding relationship between the anchor tag and the content container.

9. A device for creating a page, characterized in that: include: A monitoring module monitors the user's operation in the page editing interface, wherein the page to be edited is displayed in the page editing interface for preview, and the page to be edited includes at least: a tab bar and a content area; a code acquisition module, which sends a call request to a server according to the monitored anchor creation operation of the user, so as to obtain a pre-packaged anchor code stored in the server, wherein the anchor code includes a pre-created anchor tag, a content container corresponding to the anchor tag, and a mapping relationship between the anchor tag and the content container; A display module, which adds a control of the anchor tag in the tag bar of the page to be edited, and determines the position of the area corresponding to the content container in the content area of ​​the page to be edited; The content adding module adds the business module to the area corresponding to the content container for display according to the business module selected by the user.

10. A computer-readable storage medium, characterized in that: The storage medium stores a computer program, and when the computer program is executed by a processor, the method described in any one of claims 1 to 8 is implemented.

11. An electronic device comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, characterized in that: When the processor executes the program, the method described in any one of claims 1 to 8 is implemented.

Citation Information

Patent Citations

  • Information display method and device

    CN107368511A

  • Page code processing method and device, terminal equipment and medium

    CN108427731A

  • A method and system for quickly generating html code

    CN109086040A

  • A method and a device for generating a custom page

    CN109697064A

  • Information processing method and device

    CN111414123A