Вы используете устаревший браузер. Этот и другие сайты могут отображаться в нём некорректно. Вам необходимо обновить браузер или попробовать использовать другой.
Первое я постить не буду, ибо там слишком много переходов по различным ссылкам и везде разбросана информация, которую нужно собирать. Второе и третье попозже выложу.[DOUBLEPOST=1377425758,1377422019][/DOUBLEPOST]Introduction
With XenForo 1.2 needs to come a new mentality when dealing with templates. Lots of things have changed in this regard. And it's important for us as forum admins and developers that we change with the times, rather than getting stuck in the past.
Template Modifications (The TM System)
I can't tell you what you should or shouldn't refer to various features as. It's not my place. But please, don't call it TMC!
The TM system produces "template modifications" and the feature itself is referred to in the Admin CP as "Template Modifications" therefore we should refer to it as such where possible. Especially to save people who may not be familiar with XenForo terminology getting confused.
What does it do?
The TM system has been created primarily for add-on developers to improve the ease of developing add-ons and modifying the default appearance of templates.
At its core it is a simple "search for this, replace with that" system.
As it is primary a developer tool, I won't go into too much detail here.
What does it NOT do?
The TM system, being designed for add-on developers, does not allow you to create TMs that are specific to styles.
This may seem odd. There is an unofficial add-on (TMS) that allows template modifications by style. So if you're looking for a direct replacement for that, this isn't it.
However, the next part of this guide should provide some insight into why this isn't necessarily a priority.
Directly Editing Templates
Everyone knows that you shouldn't directly edit templates, right? Wrong.
Forget everything you know about direct template edits. Forget all of that "upgrade anxiety". Forget how forum software X previously lost hours worth of template edits after every upgrade. Forget reverting templates. This isn't forum software X. This isn't XenForo 1.1.x. This is XenForo 1.2.
XenForo 1.2 includes a new 3-way merging system for templates. Templates still get outdated. But there's a fantastic new system for handling them.
Let's say, for example, that you added a completely new line of code to a template and XenForo also modifies the template and you do an upgrade.
There will of course be an outdated template. But the difference is, you have the option to go to "Merge Changes".
In Merge Changes, it will show you all of the differences between your version of the template and the new XenForo version.
Look at this screenshot:
The two lines of code highlighted in yellow are where the XenForo version (parent) differs from the custom version (your own edit).
You get given a very simple choice:
Use the parent version and remove your custom changes.
Keep your custom version.
Keep both versions (this will probably not be a common choice for most things).
To give you an extra level of control, after you have selected one of the options you can actually edit the text directly (maybe you want to add more, or leave yourself a comment or something).
Finally, note the area in blue? Quite simply this is a custom edit you've made that has automatically merged itself, e.g. there's no conflicts. All you need to do is double check that you still want the custom change. If you don't, you can actually click to edit it or remove it.
Finally, click Merge Changes. Job done.
The benefits are:
It's easy to see what's changed in the XenForo template.
It's easy to see what you've added to the XenForo template.
It's easy to choose what action to take if some of the code conflicts.
It's easy to allow it to automatically merge changes.
It's easy to make further customisations.
You should, of course, while making direct template edits, still document your edits. You can do this by using <xen:comment> </xen:comment> syntax in your templates.
Sometimes things might be easier to manage if you actually create your own templates and then include them in the core XenForo template:
Код:
<xen:include template="your_template" />
You can also include your own CSS:
Код:
<xen:require css="your_template.css" />
What if I make a mistake?
Of course while editing templates, there is still the potential to make mistakes. You may remove something you need, or introduce something that breaks a template.
Maybe you have merged a load of stuff and things don't look right anymore. To rectify this you can just use the template history:
Summary
Use Template Modifications if you're an add-on developer. For general styling and day-to-day template changes, you do not need to use Template Modifications.
For general styling and day-to-day changes, always use direct template edits.
If you make a mistake, use the template history to compare versions.
Don't call it TMC. Call it "Template Modifications" or TMs or "the TM system". Every time you refer to it as TMC, Brogan kills a kitten.
[DOUBLEPOST=1377425943][/DOUBLEPOST]Image Zoom
I have been asked a couple times on how this is accomplished (or how I personally did it), and after a quick convo with someone about posting it here, I will do just that.
Anywho, I will use my FamilyGuyFans site as my example.
It gets asked quite a bit how I pull "Showcase" images to do this. I want to be clear, these are not images in that add-on, nor any other add-on. These images are created by you, and put on your server. I am certain you could code something to do it, but for my skill level, its just easier to do it like this. As you can see, these images just link. That is it.
Above is just a regular xenForo Page. Inside I have standard HTML:
When I first did this, I had XenPorta installed, so I used the RAWHTML block included with that download. You are not required to have it.
The key part of the code is obviously charicons2, as it will be dealing with the images.
In extra CSS, this is what I have:
Код:
#charIcons2 li img:hover {
transform: scale(1.3);
transition: all 0.4s ease-in-out 0;
z-index: 2;
position: relative !important;
}
For the sidebar at that site, you will notice the images are 2 times as big, so you would just change the transform scale to 2. My images are much bigger, so when scaled down they are fine, and on zoom they still remain easy to see without blurring.
