이미지 정렬 옵션 추가


11

드문 경우-WordPress에서 무언가를하고 싶지만 어떻게 해야하는지 알지 못하고 검색하면 문자 그대로 아무것도 나타나지 않습니다.

게시물에 이미지를 삽입하면 '없음', '왼쪽', '오른쪽', '중심'과 같은 정렬 옵션이 제공됩니다. 결과적으로 'alignleft', 'alignright'또는 'aligncenter'와 같이 정렬과 관련된 CSS 클래스로 이미지가 삽입됩니다.

큰.

내 테마가 좀 더 복잡하고 핵심 옵션과 마찬가지로 삽입 된 이미지에 새로운 CSS 클래스를 추가하는 몇 가지 옵션을 여기에 추가하려면 어떻게해야합니까? 예를 들어, 좀 더 복잡한 레이아웃을 얻기 위해 멋진 CSS로 스타일을 지정할 수있는 '오른쪽 여백'옵션?

내가 어디에서 시작할 수 있는지에 대한 조언이 있습니까?


사용자 정의 / 복잡한 레이아웃을 어떻게 정의 / 선택합니까?
칩 베넷

코드를 WordPress 4.1.0으로 업데이트했습니다. wordpress.stackexchange.com/questions/172849/…
Jack Ottermans

답변:


2

나는 David-binda에 동의합니다 – 좋은 질문입니다! 나는 여러 번이 문제에 부딪 쳤고 꽤 잘 작동하는 솔루션을 생각해 냈습니다. pavlos-bizimis가 제안한대로 클래스로 이미지를 삽입하기 위해 짧은 코드를 추가하는 아이디어가 마음에 들지만 이미지 편집 팝업에 옵션을 추가하는 것만으로도 문제를 우아하게 해결하지 못한다고 생각합니다 (예 : 아마도 이미지 ID를 수동으로 입력하지 않으려면 이미지를 단축 코드로 감싸십시오. 또한 일부 고객의 경우 단축 코드조차 너무 복잡합니다 (이 경우 TinyMCE 버튼 오프 코스에 바인딩 할 수 있음).

어쨌든 더 이상 고민 하지 않고 여기 5 센트가 있습니다. 이 솔루션을 슬라이드 쇼 플러그인에서 사용하면 슬라이드 쇼에서 이미지를 포함 / 제외하고 일부 이미지 메타 필드의 내용을 표시하는 오버레이의 배경색을 설정할 수 있습니다. 기본적으로는 후크 attachment_fields_to_editattachment_fields_to_save입력 필드를 추가하고, 각각의 형식의 데이터를 저장하기 위해. 이 데이터는 첨부 게시물 (예 : 편집중인 이미지)의 표준 게시물 메타로 사용할 수 있습니다. get_post_meta()평소처럼 쉽게 검색 할 수 있기 때문에 좋습니다 . 그리고 당신은 또한에 필터를 추가해야 wp_get_attachment_image_attributes하거나 image_send_to_editor하는 당신이 자동으로 이미지가 출력되는 때마다 해당 클래스를 추가 할 수 있습니다.

가독성을 위해 코드를 약간 수정 했으므로 일부 부분이 불완전하거나 잘못되었을 수 있습니다.

/**
 * Adds a form field for excluding images from slideshow
 *
 * @param array $form_fields Array of form fields
 * @param object $post The post to show
 * @return array Array of form fields
 * @author Simon Fransson
 **/
function hs_attachment_fields_to_edit($form_fields, $post = null)
{

    $val = (boolean)get_post_meta($post->ID, SLIDESHOW_EXCLUDE_IMAGE_KEY, true);
    $id = SLIDESHOW_EXCLUDE_IMAGE_KEY . "-" . $post->ID;
    $markup = sprintf('<label for="%s"><input type="checkbox" class="checkbox" id="%s" name="attachments[%s][%s]" value="true" %s /> %s</label>', $id, $id, $post->ID, SLIDESHOW_EXCLUDE_IMAGE_KEY, checked($val, true, false), __('Exclude from slideshow', 'slideshow'));

    $form_field = array(
        'label' => __('Slideshow', 'slideshow'),
        'input' => 'html',
        'html' => $markup,
        'value' => $val,
        'helps' => __('Excludes the image from slideshows.', 'slideshow'),
    );

    $form_fields[SLIDESHOW_EXCLUDE_IMAGE_KEY] = $form_field; // See update notice below code block!

    return $form_fields;
}
add_filter('attachment_fields_to_edit', 'hs_attachment_fields_to_edit', 10, 2);



/**
 * Save the images exclude status meta value when saving attachment data
 *
 * @param object $post Post object
 * @param  array $attachment Field values
 * @return object Post object
 * @author Simon Fransson
 **/
function hs_attachment_fields_to_save($post, $attachment = null)
{
    update_post_meta($post['ID'], SLIDESHOW_EXCLUDE_IMAGE_KEY, intval(isset($attachment[SLIDESHOW_EXCLUDE_IMAGE_KEY])));

    return $post;
}
add_filter('attachment_fields_to_save', 'hs_attachment_fields_to_save', 10, 2);


/**
 * Generate metadata for newly uploaded attachment.
 * This is here simply because we are dealing with a boolean,
 * which means that for SQL related reasons a value NEEDS to
 * exist even when noting has been specified in the options 
 *
 * @param  array $metadata Array of meta data
 * @param int $attachment_id ID of attachment post
 * @return array Array of meta data
 * @author Simon Fransson
 **/
function hs_generate_attachment_metadata($metadata, $attachment_id = null)
{
    $exclude = intval(get_post_meta($attachment_id, SLIDESHOW_EXCLUDE_IMAGE_KEY, true));
    update_post_meta($attachment_id, SLIDESHOW_EXCLUDE_IMAGE_KEY, $exclude);

    return $metadata;
}
add_filter('wp_generate_attachment_metadata', 'hs_generate_attachment_metadata', 10, 2);

업데이트 : 방금이 코드를 복사하여 작업중 인 프로젝트에서 상용구로 사용했습니다. 코드를 보면 알 수 있듯이 포스트 메타 키를 정의 된 상수로 저장하고 싶습니다. 이 작업을 수행 할 때 항상 _메타 필드 편집기에 표시되지 않도록 값을 앞에 추가 하지만이 방법으로 인해 일부 문제가 발생할 수 있습니다 attachment_fields_to_save. $form_fields배열의 키는로 시작할 수 없으므로_ 첨부 필드를 처리 할 때 배열 및 메타 값에 다른 키를 사용하거나 밑줄을 자르십시오. SLIDESHOW_EXCLUDE_IMAGE_KEY내 예제에서도 정의되지 않았 으므로 코드를 복사 할 때 아마도 큰 문제는 아니지만 어쨌든 언급 할 것이라고 생각했습니다. 이것을 알아내는 데 시간이 걸렸습니다 (그리고 두 번째로).


이것은 제안 된 최상의 솔루션처럼 보입니다. 시도해보고 어떻게 진행되는지 알려 드리겠습니다. 나와 코드를 공유해 주셔서 감사합니다.
NatalieMac

1

좋은 질문. 그리고이 질문에는 해결책이 있습니다. 아래 코드가 너무 길지만 더 짧을 수는 없습니다. 요점은 wp_print_media_templates 함수에 대한 wp_footer 및 wp_admin_footer 후크를 제거하고 사용자 정의 옵션을 사용하여 자신의 wp_print_media_templates 함수로 바꿀 수 있다는 것입니다. 간단히 아래 코드를 functions.php에 배치하면 원래 함수가 무시되고 HTML 주석이있는 줄 뒤에 클래스를 수정할 수 있습니다 <!-클래스 설정-> 클래스는 다음과 같은 방식으로 갤러리 단축 코드에 삽입됩니다.

MyClass1로 설정된 값은 alignMyClass1을 생성합니다.

remove_action( 'wp_footer', 'wp_print_media_templates' );
remove_action( 'admin_footer', 'wp_print_media_templates' );
add_action( 'admin_footer', 'my_wp_print_media_templates' );
add_action( 'wp_footer', 'my_wp_print_media_templates' );

function my_wp_print_media_templates() {
global $is_IE;
$class = 'media-modal wp-core-ui';
if ( $is_IE && strpos($_SERVER['HTTP_USER_AGENT'], 'MSIE 7') !== false )
    $class .= ' ie7';
?>
<script type="text/html" id="tmpl-media-frame">
    <div class="media-frame-menu"></div>
    <div class="media-frame-title"></div>
    <div class="media-frame-router"></div>
    <div class="media-frame-content"></div>
    <div class="media-frame-toolbar"></div>
    <div class="media-frame-uploader"></div>
</script>

<script type="text/html" id="tmpl-media-modal">
    <div class="<?php echo $class; ?>">
        <a class="media-modal-close" href="#" title="<?php esc_attr_e('Close'); ?>"><span class="media-modal-icon"></span></a>
        <div class="media-modal-content"></div>
    </div>
    <div class="media-modal-backdrop"></div>
</script>

<script type="text/html" id="tmpl-uploader-window">
    <div class="uploader-window-content">
        <h3><?php _e( 'Drop files to upload' ); ?></h3>
    </div>
</script>

<script type="text/html" id="tmpl-uploader-inline">
    <# var messageClass = data.message ? 'has-upload-message' : 'no-upload-message'; #>
    <div class="uploader-inline-content {{ messageClass }}">
    <# if ( data.message ) { #>
        <h3 class="upload-message">{{ data.message }}</h3>
    <# } #>
    <?php if ( ! _device_can_upload() ) : ?>
        <h3 class="upload-instructions"><?php _e('The web browser on your device cannot be used to upload files. You may be able to use the <a href="http://wordpress.org/extend/mobile/">native app for your device</a> instead.'); ?></h3>
    <?php elseif ( is_multisite() && ! is_upload_space_available() ) : ?>
        <h3 class="upload-instructions"><?php _e( 'Upload Limit Exceeded' ); ?></h3>
        <?php do_action( 'upload_ui_over_quota' ); ?>

    <?php else : ?>
        <div class="upload-ui">
            <h3 class="upload-instructions drop-instructions"><?php _e( 'Drop files anywhere to upload' ); ?></h3>
            <a href="#" class="browser button button-hero"><?php _e( 'Select Files' ); ?></a>
        </div>

        <div class="upload-inline-status"></div>

        <div class="post-upload-ui">
            <?php
            do_action( 'pre-upload-ui' );
            do_action( 'pre-plupload-upload-ui' );

            if ( 10 === remove_action( 'post-plupload-upload-ui', 'media_upload_flash_bypass' ) ) {
                do_action( 'post-plupload-upload-ui' );
                add_action( 'post-plupload-upload-ui', 'media_upload_flash_bypass' );
            } else {
                do_action( 'post-plupload-upload-ui' );
            }

            $upload_size_unit = $max_upload_size = wp_max_upload_size();
            $byte_sizes = array( 'KB', 'MB', 'GB' );

            for ( $u = -1; $upload_size_unit > 1024 && $u < count( $byte_sizes ) - 1; $u++ ) {
                $upload_size_unit /= 1024;
            }

            if ( $u < 0 ) {
                $upload_size_unit = 0;
                $u = 0;
            } else {
                $upload_size_unit = (int) $upload_size_unit;
            }

            ?>

            <p class="max-upload-size"><?php
                printf( __( 'Maximum upload file size: %d%s.' ), esc_html($upload_size_unit), esc_html($byte_sizes[$u]) );
            ?></p>

            <?php if ( ( $GLOBALS['is_IE'] || $GLOBALS['is_opera']) && $max_upload_size > 100 * 1024 * 1024 ) :
                $browser_uploader = admin_url( 'media-new.php?browser-uploader&post_id=' ) . '{{ data.postId }}';
                ?>
                <p class="big-file-warning"><?php printf( __( 'Your browser has some limitations uploading large files with the multi-file uploader. Please use the <a href="%1$s" target="%2$s">browser uploader</a> for files over 100MB.' ),
                    $browser_uploader, '_blank' ); ?></p>
            <?php endif; ?>

            <?php do_action( 'post-upload-ui' ); ?>
        </div>
    <?php endif; ?>
    </div>
</script>

<script type="text/html" id="tmpl-uploader-status">
    <h3><?php _e( 'Uploading' ); ?></h3>
    <a class="upload-dismiss-errors" href="#"><?php _e('Dismiss Errors'); ?></a>

    <div class="media-progress-bar"><div></div></div>
    <div class="upload-details">
        <span class="upload-count">
            <span class="upload-index"></span> / <span class="upload-total"></span>
        </span>
        <span class="upload-detail-separator">&ndash;</span>
        <span class="upload-filename"></span>
    </div>
    <div class="upload-errors"></div>
</script>

<script type="text/html" id="tmpl-uploader-status-error">
    <span class="upload-error-label"><?php _e('Error'); ?></span>
    <span class="upload-error-filename">{{{ data.filename }}}</span>
    <span class="upload-error-message">{{ data.message }}</span>
</script>

<script type="text/html" id="tmpl-attachment">
    <div class="attachment-preview type-{{ data.type }} subtype-{{ data.subtype }} {{ data.orientation }}">
        <# if ( data.uploading ) { #>
            <div class="media-progress-bar"><div></div></div>
        <# } else if ( 'image' === data.type ) { #>
            <div class="thumbnail">
                <div class="centered">
                    <img src="{{ data.size.url }}" draggable="false" />
                </div>
            </div>
        <# } else { #>
            <img src="{{ data.icon }}" class="icon" draggable="false" />
            <div class="filename">
                <div>{{ data.filename }}</div>
            </div>
        <# } #>

        <# if ( data.buttons.close ) { #>
            <a class="close media-modal-icon" href="#" title="<?php _e('Remove'); ?>"></a>
        <# } #>

        <# if ( data.buttons.check ) { #>
            <a class="check" href="#" title="<?php _e('Deselect'); ?>"><div class="media-modal-icon"></div></a>
        <# } #>
    </div>
    <#
    var maybeReadOnly = data.can.save || data.allowLocalEdits ? '' : 'readonly';
    if ( data.describe ) { #>
        <# if ( 'image' === data.type ) { #>
            <input type="text" value="{{ data.caption }}" class="describe" data-setting="caption"
                placeholder="<?php esc_attr_e('Caption this image&hellip;'); ?>" {{ maybeReadOnly }} />
        <# } else { #>
            <input type="text" value="{{ data.title }}" class="describe" data-setting="title"
                <# if ( 'video' === data.type ) { #>
                    placeholder="<?php esc_attr_e('Describe this video&hellip;'); ?>"
                <# } else if ( 'audio' === data.type ) { #>
                    placeholder="<?php esc_attr_e('Describe this audio file&hellip;'); ?>"
                <# } else { #>
                    placeholder="<?php esc_attr_e('Describe this media file&hellip;'); ?>"
                <# } #> {{ maybeReadOnly }} />
        <# } #>
    <# } #>
</script>

<script type="text/html" id="tmpl-attachment-details">
    <h3>
        <?php _e('Attachment Details'); ?>

        <span class="settings-save-status">
            <span class="spinner"></span>
            <span class="saved"><?php esc_html_e('Saved.'); ?></span>
        </span>
    </h3>
    <div class="attachment-info">
        <div class="thumbnail">
            <# if ( data.uploading ) { #>
                <div class="media-progress-bar"><div></div></div>
            <# } else if ( 'image' === data.type ) { #>
                <img src="{{ data.size.url }}" draggable="false" />
            <# } else { #>
                <img src="{{ data.icon }}" class="icon" draggable="false" />
            <# } #>
        </div>
        <div class="details">
            <div class="filename">{{ data.filename }}</div>
            <div class="uploaded">{{ data.dateFormatted }}</div>

            <# if ( 'image' === data.type && ! data.uploading ) { #>
                <# if ( data.width && data.height ) { #>
                    <div class="dimensions">{{ data.width }} &times; {{ data.height }}</div>
                <# } #>

                <# if ( data.can.save ) { #>
                    <a class="edit-attachment" href="{{ data.editLink }}&amp;image-editor" target="_blank"><?php _e( 'Edit Image' ); ?></a>
                    <a class="refresh-attachment" href="#"><?php _e( 'Refresh' ); ?></a>
                <# } #>
            <# } #>

            <# if ( ! data.uploading && data.can.remove ) { #>
                <a class="delete-attachment" href="#"><?php _e( 'Delete Permanently' ); ?></a>
            <# } #>

            <div class="compat-meta">
                <# if ( data.compat && data.compat.meta ) { #>
                    {{{ data.compat.meta }}}
                <# } #>
            </div>
        </div>
    </div>

    <# var maybeReadOnly = data.can.save || data.allowLocalEdits ? '' : 'readonly'; #>
        <label class="setting" data-setting="title">
            <span><?php _e('Title'); ?></span>
            <input type="text" value="{{ data.title }}" {{ maybeReadOnly }} />
        </label>
        <label class="setting" data-setting="caption">
            <span><?php _e('Caption'); ?></span>
            <textarea {{ maybeReadOnly }}>{{ data.caption }}</textarea>
        </label>
    <# if ( 'image' === data.type ) { #>
        <label class="setting" data-setting="alt">
            <span><?php _e('Alt Text'); ?></span>
            <input type="text" value="{{ data.alt }}" {{ maybeReadOnly }} />
        </label>
    <# } #>
        <label class="setting" data-setting="description">
            <span><?php _e('Description'); ?></span>
            <textarea {{ maybeReadOnly }}>{{ data.description }}</textarea>
        </label>
</script>

<script type="text/html" id="tmpl-media-selection">
    <div class="selection-info">
        <span class="count"></span>
        <# if ( data.editable ) { #>
            <a class="edit-selection" href="#"><?php _e('Edit'); ?></a>
        <# } #>
        <# if ( data.clearable ) { #>
            <a class="clear-selection" href="#"><?php _e('Clear'); ?></a>
        <# } #>
    </div>
    <div class="selection-view"></div>
</script>

<script type="text/html" id="tmpl-attachment-display-settings">
    <h3><?php _e('Attachment Display Settings'); ?></h3>

    <# if ( 'image' === data.type ) { #>
        <label class="setting">
            <span><?php _e('Alignment'); ?></span>
            <select class="alignment"
                data-setting="align"
                <# if ( data.userSettings ) { #>
                    data-user-setting="align"
                <# } #>>

                <option value="left">
                    <?php esc_attr_e('Left'); ?>
                </option>
                <option value="center">
                    <?php esc_attr_e('Center'); ?>
                </option>
                <option value="right">
                    <?php esc_attr_e('Right'); ?>
                </option>
                <option value="none" selected>
                    <?php esc_attr_e('None'); ?>
                </option>
                <!-- SETUP YOUR CLASSES HERE -->
                <option value="MyClass1"> <!-- set value produces class alignMyClass1 -->
                    <?php esc_attr_e('My class 1'); ?> <!-- label for your Class -->
                </option>
            </select>
        </label>
    <# } #>

    <div class="setting">
        <label>
            <span><?php _e('Link To'); ?></span>
            <select class="link-to"
                data-setting="link"
                <# if ( data.userSettings ) { #>
                    data-user-setting="urlbutton"
                <# } #>>

                <option value="custom">
                    <?php esc_attr_e('Custom URL'); ?>
                </option>
                <option value="file" selected>
                    <?php esc_attr_e('Media File'); ?>
                </option>
                <option value="post">
                    <?php esc_attr_e('Attachment Page'); ?>
                </option>
                <option value="none">
                    <?php esc_attr_e('None'); ?>
                </option>                   
            </select>
        </label>
        <input type="text" class="link-to-custom" data-setting="linkUrl" />
    </div>

    <# if ( 'undefined' !== typeof data.sizes ) { #>
        <label class="setting">
            <span><?php _e('Size'); ?></span>
            <select class="size" name="size"
                data-setting="size"
                <# if ( data.userSettings ) { #>
                    data-user-setting="imgsize"
                <# } #>>
                <?php

                $sizes = apply_filters( 'image_size_names_choose', array(
                    'thumbnail' => __('Thumbnail'),
                    'medium'    => __('Medium'),
                    'large'     => __('Large'),
                    'full'      => __('Full Size'),
                ) );

                foreach ( $sizes as $value => $name ) : ?>
                    <#
                    var size = data.sizes['<?php echo esc_js( $value ); ?>'];
                    if ( size ) { #>
                        <option value="<?php echo esc_attr( $value ); ?>" <?php selected( $value, 'full' ); ?>>
                            <?php echo esc_html( $name ); ?> &ndash; {{ size.width }} &times; {{ size.height }}
                        </option>
                    <# } #>
                <?php endforeach; ?>
            </select>
        </label>
    <# } #>
</script>

<script type="text/html" id="tmpl-gallery-settings">
    <h3><?php _e('Gallery Settings'); ?></h3>

    <label class="setting">
        <span><?php _e('Link To'); ?></span>
        <select class="link-to"
            data-setting="link"
            <# if ( data.userSettings ) { #>
                data-user-setting="urlbutton"
            <# } #>>

            <option value="file" selected>
                <?php esc_attr_e('Media File'); ?>
            </option>
            <option value="post">
                <?php esc_attr_e('Attachment Page'); ?>
            </option>
        </select>
    </label>

    <label class="setting">
        <span><?php _e('Columns'); ?></span>
        <select class="columns" name="columns"
            data-setting="columns">
            <?php for ( $i = 1; $i <= 9; $i++ ) : ?>
                <option value="<?php echo esc_attr( $i ); ?>" <?php selected( $i, 3 ); ?>>
                    <?php echo esc_html( $i ); ?>
                </option>
            <?php endfor; ?>
        </select>
    </label>

    <label class="setting">
        <span><?php _e( 'Random Order' ); ?></span>
        <input type="checkbox" data-setting="_orderbyRandom" />
    </label>
</script>

<script type="text/html" id="tmpl-embed-link-settings">
    <label class="setting">
        <span><?php _e('Title'); ?></span>
        <input type="text" class="alignment" data-setting="title" />
    </label>
</script>

<script type="text/html" id="tmpl-embed-image-settings">
    <div class="thumbnail">
        <img src="{{ data.model.url }}" draggable="false" />
    </div>

    <?php if ( ! apply_filters( 'disable_captions', '' ) ) : ?>
        <label class="setting caption">
            <span><?php _e('Caption'); ?></span>
            <textarea data-setting="caption" />
        </label>
    <?php endif; ?>

    <label class="setting alt-text">
        <span><?php _e('Alt Text'); ?></span>
        <input type="text" data-setting="alt" />
    </label>

    <div class="setting align">
        <span><?php _e('Align'); ?></span>
        <div class="button-group button-large" data-setting="align">
            <button class="button" value="left">
                <?php esc_attr_e('Left'); ?>
            </button>
            <button class="button" value="center">
                <?php esc_attr_e('Center'); ?>
            </button>
            <button class="button" value="right">
                <?php esc_attr_e('Right'); ?>
            </button>
            <button class="button active" value="none">
                <?php esc_attr_e('None'); ?>
            </button>
        </div>
    </div>

    <div class="setting link-to">
        <span><?php _e('Link To'); ?></span>
        <div class="button-group button-large" data-setting="link">
            <button class="button" value="file">
                <?php esc_attr_e('Image URL'); ?>
            </button>
            <button class="button" value="custom">
                <?php esc_attr_e('Custom URL'); ?>
            </button>
            <button class="button active" value="none">
                <?php esc_attr_e('None'); ?>
            </button>
        </div>
        <input type="text" class="link-to-custom" data-setting="linkUrl" />
    </div>
</script>

<script type="text/html" id="tmpl-attachments-css">
    <style type="text/css" id="{{ data.id }}-css">
        #{{ data.id }} {
            padding: 0 {{ data.gutter }}px;
        }

        #{{ data.id }} .attachment {
            margin: {{ data.gutter }}px;
            width: {{ data.edge }}px;
        }

        #{{ data.id }} .attachment-preview,
        #{{ data.id }} .attachment-preview .thumbnail {
            width: {{ data.edge }}px;
            height: {{ data.edge }}px;
        }

        #{{ data.id }} .portrait .thumbnail img {
            max-width: {{ data.edge }}px;
            height: auto;
        }

        #{{ data.id }} .landscape .thumbnail img {
            width: auto;
            max-height: {{ data.edge }}px;
        }
    </style>
</script>
<?php

do_action( 'print_media_templates' );
}

접두사 "align"없이 클래스를 설정하려면 게시물의 컨텐츠 텍스트 영역에 짧은 코드를 삽입하는 자바 스크립트를 수정해야하며 CSS에서 클래스 이름을 바꾸는 것과 비교하여 너무 복잡 할 수 있습니다. 엔요이!


3
핵심 기능을 내 버전으로 완전히 바꾸는 것이 앞으로 유지 관리가 쉽지 않을까 걱정됩니다. 핵심 기능에 대한 대대적 인 점검 또는 재 작성이 있다면 어떨까요?
NatalieMac

당신 말이 맞아, 필터와 액션 훅이 있기를 바랍니다. 그러나 그 전까지는 내 고객이 항상 연락을 취할 수 있기 때문에 두려워하지 않으며 빠른 해결 방법을 제공 할 것입니다.
david.binda

예,하지만 다른 플러그인이 동일한 방식으로이 코드를 사용자 정의하면 어떻게됩니까? 설명하는 방식은 하나의 플러그인으로 만 충돌없이 수행 할 수 있습니다.
NoBugs

최신 버전의 WordPress에서 이것이 가능한지 아십니까? "전각"정렬 옵션을 추가하는 방법을 찾으려고 노력했으며 @NatalieMac이 말했듯이 전체 기능을 재정의하지 않는 것이 좋습니다.
JacobTheDev

0

클래스 속성으로 이미지를 삽입하기위한 단축 코드를 작성해야 할 수도 있습니다. 나는 많은 상업 테마에서 이것을 보았다.


2
더 자세하게 설명하면 더 나은 답변이 될 것입니다. 아마도 예제 단축 코드입니다.
s_ha_dum

테마는 post_content 단축 코드를 추가하지 않아야합니다. 사용자가 테마를 전환하면 해당 단축 코드가 더 이상 구문 분석되지 않으며 의도하지 않은 포스트 컨텐츠 출력이 발생합니다.
칩 베넷

Chip에 동의-테마를 변경하면 단축 코드 경로가 모두 끊어지기 때문에 단축 코드 경로를 따르고 싶지 않습니다. 적어도 이미지에 CSS 클래스를 추가하면 테마를 변경하면 CSS 클래스가 무시됩니다.
NatalieMac

-3

고유 이미지 ID를 사용하여 특정 이미지의 스타일을 개별적으로 지정할 수 있습니다.


1
이것이 질문에 대한 대답인지 확실하지 않습니다. @NatalieMac은 이미지를 개별적으로 스타일링하는 방법을 찾지 않는 것 같습니다. 이는 노동 집약적이지만 마크 업에 더 많은 클래스를 추가하는 것입니다.
s_ha_dum

사실, 나는 할 수 있지만 이것은 매우 유연하지 않습니다. 클라이언트가 쉽게 업데이트 할 수있는 것이 필요합니다.
NatalieMac
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.