编辑文件 - webfonts.php

✏️ 正在编辑: webfonts.php

路径: /home/qyel0117/public_html/wp-content/themes/semplice7/admin/templates/webfonts.php
提示: 您可以编辑任何文件（包括二进制文件），但请注意不当修改可能导致文件损坏。

<?php
	use Semplice\Helper\Get;
	$buttons = '
		<div class="webfonts-ressource-buttons">
			<button class="click-handler" data-handler="run" data-action-type="dialog" data-setting-type="webfonts" data-action="editRessource" data-ressource-type="self-hosted-upload"><span>' . Get::svg('admin', 'customize/webfonts/self-hosted-upload') . '</span>Upload (self hosted)</button>
			<button class="click-handler" data-handler="run" data-action-type="dialog" data-setting-type="webfonts" data-action="editRessource" data-ressource-type="service"><span>' . Get::svg('admin', 'customize/webfonts/service') . '</span>Service</button>
			<button class="click-handler" data-handler="run" data-action-type="dialog" data-setting-type="webfonts" data-action="editRessource" data-ressource-type="self-hosted"><span>' . Get::svg('admin', 'customize/webfonts/self-hosted') . '</span>CSS (self hosted)</button>
		</div>
	';
?>
<template id="smp-tpl-webfonts-onboarding">
	<div class="webfonts-onboarding admin-column" data-xl-width="12">
		<div class="inner">
			<div class="header">
				<img src="<?php echo SEMPLICE_URI; ?>/assets/images/admin/customize/webfonts/onboarding.png" alt="onboarding">
			</div>
			<div class="content">
				<h2>Custom Webfonts</h2>
				<p>In Semplice you can add fonts from any external service like Typekit, Fonts.com, etc. Or even add you own self hosted fonts.</p>
				<div class="buttons">
					<?php echo $buttons; ?>
					<button class="add-webfonts-ressource" data-button-color="yellow" data-button-icon="plus"><span></span>Add Your First Source</button>
				</div>
			</div>
		</div>
	</div>
</template>
<template id="smp-tpl-webfonts">
	<div class="webfonts-wrapper">
		<div class="webfonts admin-column" data-xl-width="9">
			<ul>
				{{webfonts}}
			</ul>
		</div>
		<div class="webfonts-sidebar admin-column" data-xl-width="3">
			<div class="webfonts-ressources">
				<h3 class="sidebar-title">Resources</h3>
				<div class="sidebar-spacer-full"></div>
					<ul>
						{{ressources}}
					</ul>
				<div class="buttons">
					<?php echo $buttons; ?>
					<button class="add-webfonts-ressource" data-button-color="yellow" data-button-icon="plus"><span></span>Add Source</button>
				</div>
				{{defaultFonts}}
			</div>
		</div>
	</div>
</template>
<template id="smp-tpl-webfonts-item">
	<li id="{{fontId}}" class="webfont" data-font-type="{{fontType}}">
		<a class="click-handler" data-handler="run" data-action-type="dialog" data-setting-type="webfonts" data-action="editWebfont" data-font-id="{{fontId}}" data-mode="edit">
			<p class="font-name"><span class="variable-badge">Variable</span>{{name}}</p>
			<h4 class="{{fontId}}">ABCabc0123 The quick brown fox</h4>
		</a>
		<div class="webfonts-actions">
			<ul>
				<li><a class="click-handler" data-handler="run" data-action-type="dialog" data-setting-type="webfonts" data-action="editWebfont" data-font-id="{{fontId}}" data-mode="edit"><?php echo Get::svg('admin', 'edit'); ?></a></li>
				<li><a class="click-handler" data-handler="run" data-action-type="dialog" data-setting-type="webfonts" data-action="removeWebfont" data-type="removeFont" data-id="{{fontId}}"><?php echo Get::svg('admin', 'delete'); ?></a></li>
			</ul>
		</div>
		{{variable}}
	</li>
</template>
<template id="smp-tpl-webfonts-ressource-item">
	<li id="{{id}}" class="{{type}}"{{css}}>
		<div class="title">
			<img src="{{typeSvg}}" alt="{{type}}-icon">
			{{domainWarning}}<a class="ressource-name click-handler" data-handler="run" data-action-type="dialog" data-setting-type="webfonts" data-action="editRessource" data-mode="edit" data-ressource-id="{{id}}" data-ressource-type="{{type}}">{{name}}</a>
		</div>
		<div class="webfonts-ressources-actions">
			<ul>
				<li class="ressource-action"><a class="click-handler" data-handler="run" data-action-type="dialog" data-setting-type="webfonts" data-action="editRessource" data-mode="edit" data-ressource-id="{{id}}" data-ressource-type="{{type}}"><?php echo Get::svg('admin', 'edit'); ?></a></li>
				<li class="ressource-action"><a class="click-handler" data-handler="run" data-action-type="dialog" data-setting-type="webfonts" data-action="removeWebfont" data-type="removeRessource" data-id="{{id}}"><?php echo Get::svg('admin', 'delete'); ?></a></li>
			</ul>
		</div>
	</li>
</template>
<template id="smp-tpl-webfonts-variable-styles">
	<div id="semplice-dialog" class="dialog variable-styles-dialog">
		<div class="inner">
			<div id="variable-styles">
				<div class="inner">
					<div class="content">
						<div class="sidebar">
							<div class="sidebar-head">
								<p>Variable<br/>Style Editor</p>
							</div>
							<div class="sidebar-settings vsp-sidebar">
								<div class="sidebar-inner">
									<option-input>
										<label>Style Name</label>
										<input type="text" placeholder="Helvetica Header" value="{{name}}" data-input-type="input-text" class="is-vstyle-setting" data-name="name" data-unique-name="name">
									</option-input>
									{{axis}}
								</div>
							</div>
							<div class="sidebar-footer">
								<button class="click-handler cancel" data-button-color="dark-gray" data-handler="run" data-action-type="dialog" data-action="close">Cancel</button>
								<button class="click-handler confirm save-webfonts-ressource" data-button-color="yellow" data-handler="run" data-action-type="variableStyles" data-action="save" data-font-id="{{fontId}}" data-style-id="{{styleId}}">Save Style</button>
							</div>
						</div>
						<div class="preview">
							<div class="preview-settings">
								<div class="setting">
									<span>Font size</span>
									<option-input>
										<input type="number" class="is-vstyle-setting" data-type="webfonts" data-input-type="rangeSlider" value="20" data-input-type="range-slider" min="6" max="999" data-name="vs-font-size" data-option-id="option_vstylefos">
									</option-input>
								</div>
								<div class="setting">
									<span>Line height</span>
									<option-input>
										<input type="number" class="is-vstyle-setting" data-type="webfonts" data-input-type="rangeSlider" value="32" data-input-type="range-slider" min="6" max="999" data-name="vs-line-height" data-option-id="option_vstylelih">
									</option-input>
								</div>
								<div class="setting">
									<span>Letter Spacing</span>
									<option-input>
										<input type="number" class="is-vstyle-setting" data-type="webfonts" data-input-type="rangeSlider" value="0" data-negative="true" data-input-type="range-slider" min="6" max="999" data-name="vs-letter-spacing" data-option-id="option_vstylelet">
									</option-input>
								</div>
							</div>
							<div class="vsp-content-outer">
								<div class="preview-content vsp-content" contenteditable="true" data-font="{{fontId}}">
									Welcome to the variable style preview. Feel free to edit this text to preview your own paragraphs or headlines.<br /><br />How does this work?<br /><br />Well, you know how you usually choose weights like light, regular or bold when using a web font? That's old school now.<br /><br />With variable web fonts, you can define your own weights. So if bold is too bold and regular is too boring, you can find something in between. We call it "styles," in this case, because most of the time you can edit more than just the weight in your variable web fonts.<br /><br />Once you set your styles here, they will be available everywhere else in Semplice when selecting your web fonts.<br /><br />PRO TIPS for editing your styles:<br /><br />1. Try clicking the slider bullet and using your cursor keys (left & right) to adjust your slider value in single steps. This way, you won't get crazy if it jumps from 99 to 101.<br /><br />2. Font size, line height and letter spacing are for preview only, meaning they won't be saved with your axis settings. If you want to set site-wide size and line height styles with your variable web fonts, you can do that in the Typography section.
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</template>
<template id="smp-tpl-webfonts-style-preview">
	<li>
		<a class="variable-style-preview click-handler" data-handler="run" data-action-type="variableStyles" data-action="edit" data-font-id="{{id}}" data-style-id="{{styleId}}" style="font-variation-settings: {{css}};">{{name}}</a>
		<a class="click-handler delete-variable-style" data-handler="run" data-action-type="dialog" data-setting-type="webfonts" data-action="removeVariableStyle" data-font-id="{{id}}" data-style-id="{{styleId}}"></a>
	</li>
</template>
<template id="smp-tpl-webfonts-font-axis">
	<li class="font-axis">
		<div class="font-axis-options">
			<option-line>
				<option-input class="vfont-setting" data-size="2">
					<input type="text" data-type="webfonts" data-option-id="option_axiswghtx" placeholder="wght" value="{{axis}}" data-input-type="text" class="is-vfont-setting" data-name="axis" data-unique-name="axis">
				</option-input>
				<option-input class="vfont-setting" data-size="1">
					<div class="range-slider-wrapper">
						<input type="number" data-type="webfonts" data-option-id="option_axisminxx" value="{{min}}" data-input-type="rangeSlider" class="is-vfont-setting" data-range-slider="fontAxis" min="0" max="9999" data-option-type="add-font" data-name="axis-min" data-unique-name="min" data-negative="true">
						</div>
				</option-input>
				<option-input class="vfont-setting" data-size="1">
					<div class="range-slider-wrapper">
						<input type="number" data-type="webfonts" data-option-id="option_axismaxxx" value="{{max}}" data-input-type="rangeSlider" class="is-vfont-setting" data-range-slider="fontAxis" min="0" max="9999" data-option-type="add-font" data-name="axis-max" data-unique-name="max" data-negative="true">
						</div>
				</option-input>
				<a class="remove-axis click-handler" data-handler="run" data-action-type="axis" data-action="remove"></a>
			</option-line>
		</div>
	</li>
</template>
<template id="smp-tpl-webfonts-axis-slider">
	<div class="setting">
		<p class="setting-label">{{axis}}<span class="val">{{val}}</span></p>
		<input type="range" min="{{min}}" max="{{max}}" value="{{val}}" step="1" class="variable-style-slider is-vstyle-setting is-axis" data-axis="{{axis}}" data-name="{{axis}}" data-font-id="{{id}}" data-style-id="{{styleId}}">
	</div>
</template>
<template id="smp-tpl-webfonts-default-fonts-switch">
	<div class="default-fonts-switch">
		<option-input class="full-width-toggle" data-size="4" data-var-support="false" data-variable="false">
			<label>Include default fonts</label>
			<div class="toggle toggle-small default-fonts-toggle" data-name="default-fonts" data-input-type="toggle" data-default="off" data-val="{{status}}" data-state="{{status}}">
				<div class="circle"></div>
			</div>
		</option-input>
	</div>
</template>

← 返回文件管理器