Tags successor code. Super fast template design for hikashop

  • Posts: 34
  • Thank you received: 4
3 years 3 months ago #323668

-- HikaShop version -- : 4.3
-- Joomla version -- : 3.9.21
-- PHP version -- : 7.3

Tags replace codes. Ultra-fast template design for hikashop

Previously, hikashop templates were discussed in this forum. I want to talk about an interesting and new idea that dramatically speeds up template design for hikashop and makes it easier to edit. Reduces errors and allows amateur users to easily design their own template.
Today, new templates are moving further away from the code, and frameworks in Joomla are building templates. Some of them, like Helix Ultimate, are very fast and in version 2, dramatic changes are on the way.
But plugins are still a challenge for amateur users, and adding the style they want is a difficult process.

Before we get into the idea, let's look at the benefits of deleting as much code as possible for a plugin.
Site template plays a very important part in the sales of a store. That's why improving the user experience is so important in the world right now.

Elimination of traditional and time-consuming methods is important from two points of view.
First, it simplifies and simplifies site design, significantly reduces store design costs, and enables plugin template compatibility with various Joomla template frameworks. So we do not need to see which framework the template designer will use. We choose which framework to set up the store on.
Second, it allows amateur users to create their own template and improve it whenever they want.
3- The simplicity and customizability of the template will attract a wide range of users, and this is a great advantage for gaining another part of the market that is available to competitors.

Now how do we create this simplicity and speed?
Plugin files in Joomla! Are a combination of PHP and HTML code. PHP codes are responsible for retrieving information that will eventually be displayed to the user in the form of HTML content at the front of the site.

what is the problem?
PHP code is a big problem for amateur users. Understanding these codes is not easy for this group of users. Learning Html, css and even java is much easier than understanding PHP. Moving or changing even one character is enough to ruin the whole result and get a 503 error.

what's the solution?
Remove php code. Removing these codes from the template Html files will make the code shorter, cleaner and more understandable.

How do we do this?
With tags. This method has been common in blog templates for many years. Blog users do not use php code to design their template. They put only certain tags in the html code, and each tag invokes a portion of the content.
hikashop has a display section for editing html code of the plugin template. It is enough to consider a tag for each element that can be displayed in the front end, which is translated by a plugin and updated in the template folder. This method is now common in Joomla! Content plugins such as shortcode plugins.
All the tags are on the side of the page and the user drags it to the middle of the html page.
If that element is active in the plugin settings, it will be displayed where it was dragged, otherwise it will be turned off.

What to do with divs?
An element such as product tags may be turned off in the settings. Showing an empty div on the product page does not look interesting. The solution is to consider open and closed tags for divs. If the element inside the div is active, then the div is displayed with it, otherwise the div will be hidden.

If the translator plugin can convert tags to the desired php code well and without errors, hikashop has gained a great advantage over its competitors.

Fields will be more useful:
By tagging, you can use the desired fields in batches or individually anywhere on the page. You can even predict open and closed tags to display modules. In this way, the modules can be used freely on product pages or purchase steps.

The arrangement of the elements is easily changed:
Where is the product price best displayed? Above the title? Under the title or in the form of a box attached to the bottom of the page? Tags allow the user to change the price display with a quick and understandable move. Well let me see. Maybe we should create some custom fields to be displayed under the title and a few more at the end of the description. A group of fields are also displayed under a separate tab as product specifications.
We want to put a video instead of a gallery. It is a convenient job. We just put a few tags in the desired places.

Additional elements:
Well, now that the work is easy, maybe it is better to add other elements to the display so that the user can use them wherever he wants. What are these elements like:
- Modules
- video
- Buttons with custom expressions and specific function. For example, the purchase button with direct guidance to pay or the purchase button only to add to cart.
- Tabs. Maybe we want to put gallery, description - video - article and fields each in one tab
- Call the article
- Component calling. How amazing. Maybe we have installed a poll component and we want to call it on the thank you and return payment page and the user can comment by shaking the knobs. How good it is to be able to call the desired components in the desired place.

OK! what is your opinion. This idea is published here. I hope you use it before competitors.

Sorry I used a machine translator for lack of time.

Last edit: 3 years 3 months ago by mrhossein.

Please Log in or Create an account to join the conversation.

  • Posts: 80502
  • Thank you received: 12829
3 years 3 months ago #323708


This idea has advantages and disadvantages.
We can't just replace the PHP/HTML code in the views and then when the tag is found we replace it with the HTML/PHP code.
The first issue with this is that if you want to customize what is output by the tag, it's more difficult.
So to solve the problem, you need to create one view file for each tag so that the content of the tag itself can be customized with PHP/HTML too if needed.
Backward compatibility is another problem since we want people updating to not have their HikaShop's look changing / breaking.
And finally, as HikaShop has many different views (product page, product listing, category listing, checkout, cart details page, cart listing, etc etc), it means a lot of work to migrate the views to such a tag system.

But overall, it's a great idea to simplify customization. And that's actually what we've focused on in the last few years.
For example, here are two big things we did to improve customization:
- the checkout system has been completely redone so that you can more easily customize the checkout experience, with options for each checkout view, new checkout views and a new interface to configure the checkout workflow.
- the emails edition. Emails have been separated in HTML/template/preload sections. So that you can edit the HTML without looking at the PHP, or style the CSS without looking at the HTML. We've added a preview mechanism, and a tags list so that you know what tag you can use.

Now for the product page itself, we've split the view of the frontend into several pieces hoping to be able to simplify the code of the main view and in fine be able to have tags in the future. But in the end, the different elements are dependent of one another which makes it complex to really split the elements in different tags. For example: When you have a characteristic, if you change the variant selected, the price might have to be updated, the images might have to be updated, the add to cart button area has to be updated.
So it's possible, but it increases the complexity and thus the difficulty to add it for us.

In any case, thank you for your input. I just wanted you to know that we have such system already listed on our end as future improvements but it's not something we can do in the short term.

The following user(s) said Thank You: mrhossein

Please Log in or Create an account to join the conversation.

  • Posts: 34
  • Thank you received: 4
3 years 2 months ago #323770

Hello. Thank you.
You will definitely have a difficult task ahead of you, but this idea became important to me when I was updating my blog template at the same time as updating my hikashop template. Unlike Joomla, which has everything, I only had a few tags in my blog admin panel at bayan.ir, which I left between the html code between the divs.
When I saw the speed of work, I said to myself how good. Why not run the same method in Joomla!
Look at this template code snippet:

                    <div class="mod_both">
                        <check:if blog_links>

<box:links></box:links> The tag that specifies the type of box is the type of link display.
<check:if blog_links> A short conditional tag. This tag checks that if the links section is active in the settings and there is at least one link created then it will display the links in this box.

I was really happy the day I saw it in the payment settings.
This was very good news for your development. I hope you get these features soon.

The following user(s) said Thank You: nicolas

Please Log in or Create an account to join the conversation.

  • Posts: 34
  • Thank you received: 4
3 years 2 months ago #324323

I did not know that all the ideas I had about designing a hikashop template had already been realized in WordPress, but today I came across something that I will link to for you.


You may have seen it before, but maybe not!
Anyway, it's very similar to what went through my mind. It is very exciting to design all the sections with elements that can be placed anywhere.
This will be more interesting when we can design a dedicated page for each product in addition to the default template.

OK! I am currently designing a new version of my site with WordPress. I hope hikashop can reach it soon.

Please Log in or Create an account to join the conversation.

  • Posts: 80502
  • Thank you received: 12829
3 years 2 months ago #324338


That's indeed a really nice tool.

The following user(s) said Thank You: mrhossein

Please Log in or Create an account to join the conversation.

  • Posts: 34
  • Thank you received: 4
3 years 2 months ago #324512

nicolas wrote: Hi,

That's indeed a really nice tool.

I think one of the problems that does not allow you to quickly go to the object-oriented version of hikashop are previous users.
You can not consider them at this time. This will make it much easier for you.
You must have noticed that acymailing made the same decision and rewrote its new version so that it could design the email design section by dragging and dropping.
The same is possible for hikashop. It depends on which one your users like the most. Market research, customer surveys and competitor surveys will ultimately help you make the right decision. Whichever is right, you should not waste time and leave the opportunity to your opponent.
In the new version, you can also think of integrating with Joomla page builders and frameworks like helix ultimate 2. You can even prepare a new kernel for WordPress compatibility. In this case, it does not matter which cms hikashop users use. Either way (Joomla or WordPress) your customer will remain. Wherever they are, they work with hikashop and offer it to their customers.

But what will happen to current hikashop users?
Good question A good import plugin in the new version will solve the problem. This plugin knows how to export the settings and products of the previous version to the new version of hikashop and users will not have a hard time migrating.
Writing this for you is purely out of interest and not in my commercial interest.
I just share my ideas to get better with you. I hope they are useful.
Good luck.

The following user(s) said Thank You: nicolas

Please Log in or Create an account to join the conversation.

  • Posts: 80502
  • Thank you received: 12829
3 years 2 months ago #324514


Thank you for your input. It's great to get ideas from our users. It doesn't mean we'll be able to do them all, but I least that give us ideas we didn't think about in order to move forward.

The following user(s) said Thank You: mrhossein

Please Log in or Create an account to join the conversation.

Time to create page: 0.072 seconds
Powered by Kunena Forum