(Resolvido)Como adicionar foto no site na hora de criar a vocation.

Nother · Setembro 4, 2021

Olá, estou editando o meu site de NTO mas me surgiu uma duvida que não encontrei em lugar nenhum.

Eu queria deixar a criação de personagem parecido com isso, por acaso alguém sabe como faz? OBS: ja tenho as imagens dos personagens.
Estou usando o Myaac 0.8.6.

Aksz · Setembro 6, 2021

Olá!
Bom dia tudo bem?
Atualmente como está a sua tela de criação de personagem ?

LeoTK · Setembro 6, 2021

@Nother tipo isso aqui?

Nother · Setembro 7, 2021

Não bem dessa forma mas ela ja serve, o meu e parecido com Gesior, ele ao invez de clicar na seta para mostra a lista de vocation, ele ja mostra todas as vocations disponiveis com uma bolinha na esqueda para escolher. No caso eu queria adicionar a foto em baixo do nome e mudar a posição da bolinha de seleção

17 horas atrás, Aksz disse:

Olá!
Bom dia tudo bem?
Atualmente como está a sua tela de criação de personagem ?

Aqui é quando cria personagem com a conta logada, a foto de cima e quando cria o personagem direto na conta

Aksz · Setembro 8, 2021

Manda o código dessas duas paginas para eu dar uma analisada, eu posso por a foto aparecer, mas provavelmente teria que editar o código css para ela ficar certinha.

Nother · Setembro 8, 2021

1 hora atrás, Aksz disse:

Manda o código dessas duas paginas para eu dar uma analisada, eu posso por a foto aparecer, mas provavelmente teria que editar o código css para ela ficar certinha.

Essa é de criação de conta

{{ hook('HOOK_ACCOUNT_CREATE_BEFORE_FORM') }}
<form action="{{ getLink('account/create') }}" method="post" id="createaccount">
	<div class="TableContainer" >
		<table class="Table5" cellpadding="0" cellspacing="0" >
			<div class="CaptionContainer" >
				<div class="CaptionInnerContainer" >
					<span class="CaptionEdgeLeftTop" style="background-image:url({{ template_path }}/images/content/box-frame-edge.gif);" /></span>
					<span class="CaptionEdgeRightTop" style="background-image:url({{ template_path }}/images/content/box-frame-edge.gif);" /></span>
					<span class="CaptionBorderTop" style="background-image:url({{ template_path }}/images/content/table-headline-border.gif);" ></span>
					<span class="CaptionVerticalLeft" style="background-image:url({{ template_path }}/images/content/box-frame-vertical.gif);" /></span>
					<div class="Text" >Create {{ config.lua.serverName }} Account</div>
					<span class="CaptionVerticalRight" style="background-image:url({{ template_path }}/images/content/box-frame-vertical.gif);" /></span>
					<span class="CaptionBorderBottom" style="background-image:url({{ template_path }}/images/content/table-headline-border.gif);" ></span>
					<span class="CaptionEdgeLeftBottom" style="background-image:url({{ template_path }}/images/content/box-frame-edge.gif);" /></span>
					<span class="CaptionEdgeRightBottom" style="background-image:url({{ template_path }}/images/content/box-frame-edge.gif);" /></span>
				</div>
			</div>
			<tr>
				<td>
					<div class="InnerTableContainer" >
						<table style="width:100%;" >
							{{ hook('HOOK_ACCOUNT_CREATE_BEFORE_BOXES') }}
							<tr>
								<td>
									<div class="TableShadowContainerRightTop"> <div class="TableShadowRightTop" style="background-image:url({{ template_path }}/images/global/content/table-shadow-rt.gif);"></div></div>
									<div class="TableContentAndRightShadow" style="background-image:url({{ template_path }}/images/global/content/table-shadow-rm.gif);">
										<div class="TableContentContainer">
											<table class="TableContent" width="100%" style="border:1px solid #faf0d7;">
												<tbody>

												{{ hook('HOOK_ACCOUNT_CREATE_BEFORE_ACCOUNT') }}

												<tr>
													<td class="LabelV" style="width: 150px">
														<span{% if errors.account is defined %} class="red"{% endif %}>Account {% if constant('USE_ACCOUNT_NAME') %}Name{% else %}Number{% endif %}:</span>
													</td>
													<td>
														<input type="text" name="account" id="account_input" size="30" maxlength="{% if constant('USE_ACCOUNT_NAME') %}30{% else %}10{% endif %}" value="{{ account }}" autofocus/>
														<img id="account_indicator" src="images/global/general/{% if not save or errors.account is defined %}n{% endif %}ok.gif" style="display: none;" />
													</td>
												</tr>
												<tr><td></td><td><span id="account_error" class="FormFieldError">{% if errors.account is defined %}{{ errors.account }}{% endif %}</span></td></tr>
												{{ hook('HOOK_ACCOUNT_CREATE_AFTER_ACCOUNT') }}
												<tr>
													<td class="LabelV" style="width: 150px">
														<span{% if errors.email is defined %} class="red"{% endif %}>Email Address:</span>
													</td>
													<td>
														<input type="text" name="email" id="email" size="30" maxlength="50" value="{{ email }}" />
														<img id="email_indicator" src="images/global/general/{% if not save or errors.email is defined %}n{% endif %}ok.gif" style="display: none;" />
													</td>
												</tr>
												<tr>
													<td></td><td><span id="email_error" class="FormFieldError">{% if errors.email is defined %}{{ errors.email }}{% endif %}</span></td>
												</tr>

												{% if config.mail_enabled and config.account_mail_verify %}
													<tr><td></td><td><span><strong>Please use real address!<br/>We will send a link to validate your Email.</strong></span></td></tr>
												{% endif %}

												{{ hook('HOOK_ACCOUNT_CREATE_AFTER_EMAIL') }}

                                                {% if config.account_country %}
													<tr>
														<td class="LabelV" style="width: 150px">
															<span{% if errors.country[0] is defined %} class="red"{% endif %}>Country:</span>
														</td>
														<td>
															<select name="country" id="account_country">
                                                                {% for code, country_ in countries %}
																	<option value="{{ code }}"{% if(country is defined and country == code) or (country is null and country_recognized == code) %}selected{% endif %}>{{ country_ }}</option>
                                                                {% endfor %}
															</select>
															<img src="" id="account_country_img"/>
														</td>
													</tr>
                                                    {% if errors.country is defined %}
														<tr><td></td><td><span class="FormFieldError">{{ errors.country }}</span></td></tr>
                                                    {% endif %}
                                                {% endif %}

												{{ hook('HOOK_ACCOUNT_CREATE_AFTER_COUNTRY') }}

												<tr>
													<td class="LabelV" style="width: 150px">
														<span{% if errors.password is defined %} class="red"{% endif %}>Password:</span>
													</td>
													<td>
														<input type="password" name="password" id="password" value="" size="30" maxlength="29" />
														<img id="password_indicator" src="images/global/general/{% if not save or errors.password is defined %}n{% endif %}ok.gif" style="display: none;" />
													</td>
												</tr>
												<tr><td></td><td><span id="password_error" class="FormFieldError">{% if errors.password is defined %}{{ errors.password }}{% endif %}</span></td></tr>
												<tr>
													<td class="LabelV" style="width: 150px">
														<span{% if errors.password is defined %} class="red"{% endif %}>Repeat password:</span>
													</td>
													<td>
														<input type="password" name="password2" id="password2" value="" size="30" maxlength="29" />
														<img id="password2_indicator" src="images/global/general/{% if not save or errors.password is defined %}n{% endif %}ok.gif" style="display: none;" />
													</td>
												</tr>
												<tr><td></td><td><span id="password2_error" class="FormFieldError">{% if errors.password is defined %}{{ errors.password }}{% endif %}</span></td></tr>

												{{ hook('HOOK_ACCOUNT_CREATE_AFTER_PASSWORDS') }}

                                                {% if config.recaptcha_enabled %}
													<tr>
														<td class="LabelV" style="width: 150px">
															<span{% if errors.verification[0] is defined %} class="red"{% endif %}>Verification:</span>
														</td>
														<td>
															<div class="g-recaptcha" data-sitekey="{{ config.recaptcha_site_key }}" data-theme="{{ config.recaptcha_theme }}"></div>
														</td>
													</tr>
                                                    {% if errors.verification is defined %}
														<tr><td></td><td><span class="FormFieldError">{{ errors.verification }}</span></td></tr>
                                                    {% endif %}
                                                {% endif %}

												{{ hook('HOOK_ACCOUNT_CREATE_AFTER_RECAPTCHA') }}
												</tbody>
											</table>
										</div>
									</div>
									<div class="TableShadowContainer">
										<div class="TableBottomShadow" style="background-image:url({{ template_path }}/images/global/content/table-shadow-bm.gif);"> <div class="TableBottomLeftShadow" style="background-image:url({{ template_path }}/images/global/content/table-shadow-bl.gif);"></div> <div class="TableBottomRightShadow" style="background-image:url({{ template_path }}/images/global/content/table-shadow-br.gif);"></div> </div></div>
								</td>
							</tr>

							{{ hook('HOOK_ACCOUNT_CREATE_BETWEEN_BOXES_1') }}

							{% if (not config.mail_enabled or not config.account_mail_verify) and config.account_create_character_create %}
							<tr>
								<td>
									<div class="TableShadowContainerRightTop">
										<div class="TableShadowRightTop" style="background-image:url({{ template_path }}/images/global/content/table-shadow-rt.gif);"></div>
									</div>
									<div class="TableContentAndRightShadow" style="background-image:url({{ template_path }}/images/global/content/table-shadow-rm.gif);">
										<div class="TableContentContainer">
											<table class="TableContent" width="100%" style="border:1px solid #faf0d7;">
												<tbody>

												{{ hook('HOOK_ACCOUNT_CREATE_BEFORE_CHARACTER_NAME') }}

												<tr>
													<td class="LabelV" style="width: 150px">
														<span{% if errors.name is defined %} class="red"{% endif %}>Character Name:</span>
													</td>
													<td>
														<input id="character_name" name="name" size="{{ config.character_name_max_length }}" maxlength="{{ config.character_name_max_length }}" value="{{ name }}"/>
														<img id="character_indicator" src="images/global/general/{% if not save or errors.name is defined %}n{% endif %}ok.gif" style="display: none;" />
														<br>
													</td>
												</tr>
												<tr>
													<td></td>
													<td>
														<span id="character_error" class="FormFieldError">{% if errors.name is defined %}{{ errors.name }}{% endif %}</span>
													</td>
												</tr>

												{{ hook('HOOK_ACCOUNT_CREATE_AFTER_CHARACTER_NAME') }}

												<tr>
													<td class="LabelV" style="width: 150px">
														<span{% if errors.sex is defined %} class="red"{% endif %}>Sex:</span>
													</td>
													<td>
														<table width="100%">
															<tbody>
															<tr>
																<td>
                                                                    {% set i = 0 %}
                                                                    {% for id, gender in config.genders|reverse(true) %}
                                                                        {% set i = i + 1 %}
																		<span style="margin-right:15px;" class="OptionContainer">
																			<input type="radio" name="sex" id="sex{{ i }}" value="{{ id }}"{% if sex is not null and sex == id %} checked="checked"{% endif %}>
																			<label for="sex{{ i }}">{{ gender|lower }}</label>
																		</span>
                                                                    {% endfor %}
																</td>
																<td>
																</td>
															</tr>
															</tbody>
														</table>
													</td>
												</tr>
												<tr>
													<td></td>
													<td>
														<span id="sex_error" class="FormFieldError">{% if errors.sex is defined %}{{ errors.sex }}{% endif %}</span>
													</td>
												</tr>

												{{ hook('HOOK_ACCOUNT_CREATE_AFTER_SEX') }}

                                                {% if config.character_samples|length > 1 %}
												<tr>
													<td class="LabelV" style="width: 150px">
														<span{% if errors.vocation is defined %} class="red"{% endif %}>Vocation:</span>
													</td>
													<td>
														<table width="100%" >
															<tbody>
															<tr>
																<td>
                                                           		{% for key, sample_char in config.character_samples %}
																	<span style="margin-right:15px;" class="OptionContainer">
																		<input type="radio" name="vocation" id="vocation{{ key }}" value="{{ key }}"
                                                                                {% if vocation is not null and vocation == key %} checked="checked"{% endif %}>
																		<label for="vocation{{ key }}">{{ config['vocations'][key] }}</label>
																	</span>
                                                            	{% endfor %}
																</td>
															</tr>
															</tbody>
														</table>
													</td>
												</tr>
												<tr>
													<td></td>
													<td>
														<span id="vocation_error" class="FormFieldError">{% if errors.vocation is defined %}{{ errors.vocation }}{% endif %}</span>
													</td>
												</tr>
												{% endif %}

												{{ hook('HOOK_ACCOUNT_CREATE_AFTER_VOCATION') }}

                                                {% if config.character_towns|length > 1 %}
												<tr>
													<td class="LabelV" style="width: 150px">
														<span{% if errors.town is defined %} class="red"{% endif %}>Select your city:</span>
													</td>
													<td>
														<table width="100%" >
															<tbody>
															<tr>
																<td>
																	{% for town_id in config.character_towns %}
																		<span style="margin-right:15px;" class="OptionContainer">
																			<input type="radio" name="town" id="town{{ town_id }}" value="{{ town_id }}"
																					{% if town is not null and town == town_id %} checked="checked"{% endif %}>
																			<label for="town{{ town_id }}">{{ config.towns[town_id] }}</label>
																		</span>
																	{% endfor %}
																</td>
															</tr>
															</tbody>
														</table>
													</td>
												</tr>
                                                {% endif %}

												{{ hook('HOOK_ACCOUNT_CREATE_AFTER_TOWNS') }}

												</tbody>
											</table>
										</div>
									</div>
									<div class="TableShadowContainer">
										<div class="TableBottomShadow" style="background-image:url({{ template_path }}/images/global/content/table-shadow-bm.gif);">
											<div class="TableBottomLeftShadow" style="background-image:url({{ template_path }}/images/global/content/table-shadow-bl.gif);"></div>
											<div class="TableBottomRightShadow" style="background-image:url({{ template_path }}/images/global/content/table-shadow-br.gif);"></div>
										</div>
									</div>
								</td>
							</tr>
							{% endif %}

							{{ hook('HOOK_ACCOUNT_CREATE_BETWEEN_BOXES_2') }}

							<tr>
								<td>
									<div class="TableShadowContainerRightTop">
										<div class="TableShadowRightTop" style="background-image:url({{ template_path }}/images/global/content/table-shadow-rt.gif);"></div>
									</div>
									<div class="TableContentAndRightShadow" style="background-image:url({{ template_path }}/images/global/content/table-shadow-rm.gif);">
										<div class="TableContentContainer">
											<table class="TableContent" width="100%" style="border:1px solid #faf0d7;">
												<tbody>
												<tr>
													<td colspan="2" ><b>Please select the following check box:</b></td>
												</tr>
												<tr>
													<td colspan="2" >
														<span><input type="checkbox" id="accept_rules" name="accept_rules" value="true"{% if accept_rules %}checked{% endif %}/> <label for="accept_rules">I agree to the <a href="?subtopic=rules" target="_blank">{{ config.lua.serverName }} Rules</a>.</label></span>
													</td>
												</tr>
                                                {% if errors.accept_rules is defined %}
													<tr>
														<td colspan="2">
															<span class="FormFieldError">{{ errors.accept_rules }}</span>
														</td>
													</tr>
                                                {% endif %}
												</tbody>
											</table>
										</div>
									</div>
									<div class="TableShadowContainer">
										<div class="TableBottomShadow" style="background-image:url({{ template_path }}/images/global/content/table-shadow-bm.gif);"> <div class="TableBottomLeftShadow" style="background-image:url({{ template_path }}/images/global/content/table-shadow-bl.gif);"></div> <div class="TableBottomRightShadow" style="background-image:url({{ template_path }}/images/global/content/table-shadow-br.gif);"></div>
										</div>
									</div>
								</td>
							</tr>

							{{ hook('HOOK_ACCOUNT_CREATE_AFTER_BOXES') }}

						</table>
					</div>
				</td>
			</tr>
		</table>
	</div>
	<br/>
	{{ hook('HOOK_ACCOUNT_CREATE_BEFORE_SUBMIT_BUTTON') }}
	<table width="100%">
		<tr align="center">
			<td>
				<table border="0" cellspacing="0" cellpadding="0" >
					<tr>
						<td style="border:0px;" >
							<input type="hidden" name="save" value="1" >
							{{ include('buttons.submit.html.twig') }}
						</td>
					</tr>
				</table>
			</td>
		</tr>
	</table>
</form>
{{ hook('HOOK_ACCOUNT_CREATE_AFTER_FORM') }}
<script type="text/javascript" src="tools/check_name.js"></script>

E essa é de criar personagem

Please choose a name{% if config.character_samples|length > 1 %}, vocation{% endif %}
{% if config.character_towns|length > 1 %}, town{% endif %}
 and sex for your character. <br/>
In any case the name must not violate the naming conventions stated in the <a href="?subtopic=rules" target="_blank" >{{ config.lua.serverName }} Rules</a>, or your character might get deleted or name locked.
{% if account_logged.getPlayersList()|length >= config.characters_per_account %}
<b><span style="color: red"> You have maximum number of characters per account on your account. Delete one before you make new.</span></b>
{% endif %}
<br/><br/>
<form action="{{ getLink('account/character/create') }}" method="post">
	<input type="hidden" name="save" value="1">
	<div class="TableContainer">
		<table class="Table3" cellpadding="0" cellspacing="0">
			<div class="CaptionContainer">
				<div class="CaptionInnerContainer">
					<span class="CaptionEdgeLeftTop" style="background-image:url({{ template_path }}/images/content/box-frame-edge.gif);"></span>
					<span class="CaptionEdgeRightTop" style="background-image:url({{ template_path }}/images/content/box-frame-edge.gif);"></span>
					<span class="CaptionBorderTop" style="background-image:url({{ template_path }}/images/content/table-headline-border.gif);"></span>
					<span class="CaptionVerticalLeft" style="background-image:url({{ template_path }}/images/content/box-frame-vertical.gif);"></span>
					<div class="Text" >Create Character</div>
					<span class="CaptionVerticalRight" style="background-image:url({{ template_path }}/images/content/box-frame-vertical.gif);"></span>
					<span class="CaptionBorderBottom" style="background-image:url({{ template_path }}/images/content/table-headline-border.gif);"></span>
					<span class="CaptionEdgeLeftBottom" style="background-image:url({{ template_path }}/images/content/box-frame-edge.gif);"></span>
					<span class="CaptionEdgeRightBottom" style="background-image:url({{ template_path }}/images/content/box-frame-edge.gif);"></span>
				</div>
			</div>
			<tr>
				<td>
					<div class="InnerTableContainer">
						<table style="width:100%;">
							<tr>
								<td>
									<div class="TableShadowContainerRightTop">
										<div class="TableShadowRightTop" style="background-image:url({{ template_path }}/images/content/table-shadow-rt.gif);"></div>
									</div>
									<div class="TableContentAndRightShadow" style="background-image:url({{ template_path }}/images/content/table-shadow-rm.gif);">
										<div class="TableContentContainer">
											<table class="TableContent" width="100%">
												<tr class="LabelH">
													<td style="width:50%;">
														<span>Name</span>
													</td>
													<td>
														<span>Sex</span>
													</td>
												</tr>
												<tr class="Odd">
													<td>
														<input name="name" id="character_name" value="{{ name }}" size="{{ config.character_name_max_length }}" maxlength="{{ config.character_name_max_length }}" >
														<img id="character_indicator" src="images/global/general/{% if not save or errors.name is defined %}n{% endif %}ok.gif" />
														<br/>
														<span style="font-size: 10px">
															<div id="character_error">{% if not save or errors.name is defined %}Please enter your character name.{% endif %}</div>
														</span>
													</td>
													<td>
														{% set i = 0 %}
														{% for id, gender in config.genders|reverse(true) %}
														{% set i = i + 1 %}
														<input type="radio" name="sex" id="sex{{ i }}" value="{{ id }}"{% if sex is not null and sex == id %} checked="checked"{% endif %}
														><label for="sex{{ i }}">{{ gender|lower }}</label><br/>
														{% endfor %}
													</td>
												</tr>
											</table>
										</div>
									</div>
						</table>
					</div>
					<div class="InnerTableContainer">
						<table style="width: 100%;">
							<tr>
								{% if config.character_samples|length > 1 %}
								<td>
									<table class="TableContent" width="100%">
										<tr class="Odd" valign="top">
											<td width="160"><br/><b>Select your vocation:</b></td>
											<td>
												<table class="TableContent" width="100%" >
													{% for key, sample_char in config.character_samples %}
													<tr>
														<td>
															<input type="radio" name="vocation" id="vocation{{ key }}" value="{{ key }}"
															{% if vocation is not null and vocation == key %} checked="checked"{% endif %}>
															<label for="vocation{{ key }}">{{ config['vocations'][key] }}</label>
														</td>
													</tr>
													{% endfor %}
												</table>
											</td>
										</tr>
									</table>
								{% endif %}
								{% if config.character_towns|length > 1 %}
								<td>
									<table class="TableContent" width="100%">
										<tr class="Odd" valign="top">
											<td width="160"><br/><b>Select your city:</b></td>
											<td>
												<table class="TableContent" width="100%">
													{% for town_id in config.character_towns %}
													<tr>
														<td>
															<input type="radio" name="town" id="town{{ town_id }}" value="{{ town_id }}"
															{% if town is not null and town == town_id %} checked="checked"{% endif %}>
															<label for="town{{ town_id }}">{{ config.towns[town_id] }}</label>
														</td>
													</tr>
													{% endfor %}
												</table>
											</td>
										</tr>
									</table>
								</td>
								{% endif %}
							</tr>
						</table>
					</div>
				</td>
			</tr>
		</table>
	</div>
	<br/>
	<table style="width:100%;">
		<tr align="center">
			<td>
				<table border="0" cellspacing="0" cellpadding="0">
					<tr>
						<td style="border:0px;">
							{{ include('buttons.submit.html.twig') }}
						</td>
					</tr>
</form>
				</table>
			</td>
			<td>
				<table border="0" cellspacing="0" cellpadding="0">
					<form action="{{ getLink('account/manage') }}" method="post">
						<tr>
							<td style="border:0px;">
								{{ include('buttons.back.html.twig') }}
							</td>
						</tr>
					</form>
				</table>
			</td>
		</tr>
	</table>
<script type="text/javascript" src="tools/check_name.js"></script>

Aksz · Setembro 9, 2021

Faça um backup antes,

Na pagina de criar char, subistitui por essa aqui.

Please choose a name{% if config.character_samples|length > 1 %}, vocation{% endif %}
{% if config.character_towns|length > 1 %}, town{% endif %}
 and sex for your character. <br/>
In any case the name must not violate the naming conventions stated in the <a href="?subtopic=rules" target="_blank" >{{ config.lua.serverName }} Rules</a>, or your character might get deleted or name locked.
{% if account_logged.getPlayersList()|length >= config.characters_per_account %}
<b><span style="color: red"> You have maximum number of characters per account on your account. Delete one before you make new.</span></b>
{% endif %}
<br/><br/>
<form action="{{ getLink('account/character/create') }}" method="post">
	<input type="hidden" name="save" value="1">
	<div class="TableContainer">
		<table class="Table3" cellpadding="0" cellspacing="0">
			<div class="CaptionContainer">
				<div class="CaptionInnerContainer">
					<span class="CaptionEdgeLeftTop" style="background-image:url({{ template_path }}/images/content/box-frame-edge.gif);"></span>
					<span class="CaptionEdgeRightTop" style="background-image:url({{ template_path }}/images/content/box-frame-edge.gif);"></span>
					<span class="CaptionBorderTop" style="background-image:url({{ template_path }}/images/content/table-headline-border.gif);"></span>
					<span class="CaptionVerticalLeft" style="background-image:url({{ template_path }}/images/content/box-frame-vertical.gif);"></span>
					<div class="Text" >Create Character</div>
					<span class="CaptionVerticalRight" style="background-image:url({{ template_path }}/images/content/box-frame-vertical.gif);"></span>
					<span class="CaptionBorderBottom" style="background-image:url({{ template_path }}/images/content/table-headline-border.gif);"></span>
					<span class="CaptionEdgeLeftBottom" style="background-image:url({{ template_path }}/images/content/box-frame-edge.gif);"></span>
					<span class="CaptionEdgeRightBottom" style="background-image:url({{ template_path }}/images/content/box-frame-edge.gif);"></span>
				</div>
			</div>
			<tr>
				<td>
					<div class="InnerTableContainer">
						<table style="width:100%;">
							<tr>
								<td>
									<div class="TableShadowContainerRightTop">
										<div class="TableShadowRightTop" style="background-image:url({{ template_path }}/images/content/table-shadow-rt.gif);"></div>
									</div>
									<div class="TableContentAndRightShadow" style="background-image:url({{ template_path }}/images/content/table-shadow-rm.gif);">
										<div class="TableContentContainer">
											<table class="TableContent" width="100%">
												<tr class="LabelH">
													<td style="width:50%;">
														<span>Name</span>
													</td>
													<td>
														<span>Sex</span>
													</td>
												</tr>
												<tr class="Odd">
													<td>
														<input name="name" id="character_name" value="{{ name }}" size="{{ config.character_name_max_length }}" maxlength="{{ config.character_name_max_length }}" >
														<img id="character_indicator" src="images/global/general/{% if not save or errors.name is defined %}n{% endif %}ok.gif" />
														<br/>
														<span style="font-size: 10px">
															<div id="character_error">{% if not save or errors.name is defined %}Please enter your character name.{% endif %}</div>
														</span>
													</td>
													<td>
														{% set i = 0 %}
														{% for id, gender in config.genders|reverse(true) %}
														{% set i = i + 1 %}
														<input type="radio" name="sex" id="sex{{ i }}" value="{{ id }}"{% if sex is not null and sex == id %} checked="checked"{% endif %}
														><label for="sex{{ i }}">{{ gender|lower }}</label><br/>
														{% endfor %}
													</td>
												</tr>
											</table>
										</div>
									</div>
						</table>
					</div>
					<div class="InnerTableContainer">
						<table style="width: 100%;">
							<tr>
{% if config.character_samples|length > 1 %}
    <td>
    <table class="TableContent" width="100%">
        <tr class="Odd" valign="top">
            <td width="160"><br/><b>Select your vocation:</b></td>
            <td>
                <div class="vocations">
                    {% for key, sample_char in config.character_samples %}
                        <div class="vocation">
                            <input type="radio" class="vocation__radio-item" name="vocation" id="vocation{{ key }}" value="{{ key }}"
                                    {% if vocation is not null and vocation == key %} checked="checked"{% endif %}>
                            <label for="vocation{{ key }}" class="vocation-label">
                                <img class="vocation-label__img" src="{{ config['vocation_images'][key] }}" alt="{{ config['vocations'][key] }}"/>
                                <span class="vocation-label__name">{{ config['vocations'][key] }}</span>
                            </label>
                        </div>
                    {% endfor %}
                </div>
            </td>
        </tr>
    </table>
{% endif %}
								{% if config.character_towns|length > 1 %}
								<td>
									<table class="TableContent" width="100%">
										<tr class="Odd" valign="top">
											<td width="160"><br/><b>Select your city:</b></td>
											<td>
												<table class="TableContent" width="100%">
													{% for town_id in config.character_towns %}
													<tr>
														<td>
															<input type="radio" name="town" id="town{{ town_id }}" value="{{ town_id }}"
															{% if town is not null and town == town_id %} checked="checked"{% endif %}>
															<label for="town{{ town_id }}">{{ config.towns[town_id] }}</label>
														</td>
													</tr>
													{% endfor %}
												</table>
											</td>
										</tr>
									</table>
								</td>
								{% endif %}
							</tr>
						</table>
					</div>
				</td>
			</tr>
		</table>
	</div>
	<br/>
	<table style="width:100%;">
		<tr align="center">
			<td>
				<table border="0" cellspacing="0" cellpadding="0">
					<tr>
						<td style="border:0px;">
							{{ include('buttons.submit.html.twig') }}
						</td>
					</tr>
</form>
				</table>
			</td>
			<td>
				<table border="0" cellspacing="0" cellpadding="0">
					<form action="{{ getLink('account/manage') }}" method="post">
						<tr>
							<td style="border:0px;">
								{{ include('buttons.back.html.twig') }}
							</td>
						</tr>
					</form>
				</table>
			</td>
		</tr>
	</table>
<script type="text/javascript" src="tools/check_name.js"></script>

no config.php adiciona isso aqui

'vocation_images' => array( // vocations, format: ID_of_vocation => 'Path to image'
    1 => '/images/vocations/vocation_1.png',
    2 => '/images/vocations/vocation_2.png',
    3 => '/images/vocations/vocation_3.png',
    4 => '/images/vocations/vocation_4.png',
),

'vocation_images' => array( // Vocações, Formato: ID da Vocação => 'Diretorio da imagem'
    1 => '/images/vocations/Vocação1.png',
    2 => '/images/vocations/Vocação2.png',
    3 => '/images/vocations/Vocação3.png',
    4 => '/images/vocations/Vocação4.png',
),

Os estilos usa-se esse aqui para teste.

        <style>
            .vocations {
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
            }
            .vocation {
                flex: 50%;
                text-align: center;
            }
            .vocation input[type=radio] {
                display: none;
            }
            .vocation__radio-item:checked +.vocation-label .vocation-label__name {
                color: red;
            }
            .vocation-label__img {
                max-width: 100%;
            }
            .vocation-label__name {
                display: block;
                margin-top: 20px;
            }
            .vocation-label:hover .vocation-label__name, .vocation-label:active .vocation-label__name, .vocation-label:focus .vocation-label__name {
                color: red;
            }
        </style>

verifica como vai ficar, por gentileza.

Nother · Setembro 9, 2021

@Aksz onde eu adiciono os Styles? primeira vez que eu edito um site.

Aksz · Setembro 10, 2021

Pode por na pagina que cria o char mesmo, para teste.

Ou se não, verifica onde está o CSS principal e adiciona lá, mas pode por na pagina de criar char mesmo pra teste.

Nother · Setembro 10, 2021

2 horas atrás, Aksz disse:

Pode por na pagina que cria o char mesmo, para teste.

Ou se não, verifica onde está o CSS principal e adiciona lá, mas pode por na pagina de criar char mesmo pra teste.

Tentei aqui de diversas formas mas não consegui, como o meu caso e um caso especifico você não teria um discord para ficar mais facil não?
Dai quando eu conseguir a solução eu posto aqui novamente para quem quiser fazer o mesmo.

Aksz · Setembro 15, 2021

Bom dia!
Me manda uma mensagem MP, como se trata de um caso especifico, vamos te que testar varias configurações, então fica combinado assim, quando achar a solução, postamos aqui, para quem quiser usar também, ta bom?

warlens · Setembro 28, 2021

Opa depois de quebrar muito a cabeça, eu conseguir colocar de um jeito através do modern acc, com click, seguindo muitos tutoriais, ficou assim:
eu usei uns codigo src com <center> e outras função pra detectar as vocações.

Aksz · Outubro 2, 2021

Problema resolvido.

Solução :

Foi trocado a linha do input que puxava somente o nome das vocations, por essa.

OBS : Tanto na tela de criação de char, quando na criação de conta foi alterado e posto esse código.

                <div class="vocations">
                    {% for key, sample_char in config.character_samples %}
                        <div class="vocation">
                            <input type="radio" class="vocation__radio-item" name="vocation" id="vocation{{ key }}" value="{{ key }}"
                                    {% if vocation is not null and vocation == key %} checked="checked"{% endif %}>
                            <label for="vocation{{ key }}" class="vocation-label">
                                <img class="vocation-label__img" src="{{ config['vocation_images'][key] }}" alt="{{ config['vocations'][key] }}"/>
                                <span class="vocation-label__name">{{ config['vocations'][key] }}</span>
                            </label>
                        </div>
                    {% endfor %}
                </div>

E o código CSS para ficar certinho usado foi esse.

 .vocations {
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
            }
            .vocation {
                flex: 50%;
                text-align: center;
            }
            .vocation input[type=radio] {
                display: none;
            }
            .vocation__radio-item:checked +.vocation-label .vocation-label__name {
                color: red;
            }
            .vocation-label__img {
                max-width: 100%;
            }
            .vocation-label__name {
                display: block;
                margin-top: 20px;
            }
            .vocation-label:hover .vocation-label__name, .vocation-label:active .vocation-label__name, .vocation-label:focus .vocation-label__name {
                color: red;
            }

Entrar

(Resolvido)Como adicionar foto no site na hora de criar a vocation.

Posts Recomendados

Link para o post

Compartilhar em outros sites

Link para o post

Compartilhar em outros sites

Link para o post

Compartilhar em outros sites

Link para o post

Compartilhar em outros sites

Link para o post

Compartilhar em outros sites

Link para o post

Compartilhar em outros sites

Link para o post

Compartilhar em outros sites

Link para o post

Compartilhar em outros sites

Link para o post

Compartilhar em outros sites

Link para o post

Compartilhar em outros sites

Link para o post

Compartilhar em outros sites

Link para o post

Compartilhar em outros sites

Link para o post

Compartilhar em outros sites

Participe da conversa

Quem Está Navegando 0 membros estão online

TibiaKing

Open Tibia Server

Redes Sociais

Anuncie no TibiaKing

Informação Importante