স্ট্যান্ডার্ড অ্যাডমিন সিএসএস আইডি / ক্লাস ট্যাগগুলি কী কী?


45

ওয়ার্ডপ্রেস সিএসডি আইডি / ক্লাসগুলির একটি তালিকা রয়েছে যা আমি প্লাগইন অপশন স্ক্রিনগুলি তৈরি করতে ব্যবহার করতে পারি যা দেখতে সাধারণ ওয়ার্ডপ্রেস বিকল্প পৃষ্ঠার মতো দেখতে আরও বেশি লাগে? আমি Serendipity মাধ্যমে কিছু খুঁজে পেয়েছি তবে এটি একটি তালিকা ahve ভাল লাগবে।

একটি উদাহরণ এই শ্রেণীর: বোতাম-প্রাথমিক যা বোতামটিকে এমন দেখায়: buttom-প্রাথমিক


এটি কেবল ওয়ার্ডপ্রেসে একটি স্ট্যান্ডার্ড সেভ বোতামের মতো দেখাচ্ছে। আমি যদি ছবিটি পোস্ট করার জন্য যথেষ্ট খ্যাতি পাই তবে মাত্র 2 পয়েন্ট মিস করছি :)
ওলে হেনরিক স্কোগ্রাস্টম

2
এখন আপনি 13 টি কারণ পেয়েছেন এটি একটি ভাল প্রশ্ন: ডি
মরিফায়ার

1
হাই, আমি একটি সমাধান দিচ্ছি তবে যা এই প্রশ্নের সাথে ঠিক প্রাসঙ্গিক নয় তবে এটি ওয়েব বিকাশের জন্য খুব সহায়ক। এখানে ওয়েব বিকাশকারী সরঞ্জাম যা একটি ওয়েব পৃষ্ঠার প্রতিটি তথ্য দেখায়। দয়া করে এটি এই লিঙ্ক থেকে ডাউনলোড করুন: chrispederick.com/work/web-developer এটি একটি ফায়ারব্যাগ অ্যাডন হিসাবে ইনস্টল করা হবে এবং আপনি খুব সহজেই এটি ব্যবহার করতে পারেন।
w3uiguru

দেখতে সুন্দর @ হ্যাপীসিংহ এটিকে খারাপ দেখায়, ভাল দেবের সরঞ্জামগুলি সর্বদা কার্যকর থাকে :)
ওলে হেনরিক স্কোগ্রাস্টম

উত্তর:


15

আমরা এই তথ্য আরও জানতে এবং 3.2 থেকে স্টাইল আপডেটগুলি প্রতিফলিত করতে http://dotorgstyleguide.wordpress.com/ আপডেট করার কাজ করছি ।

এগুলি ছাড়াও, আমি একটি প্লাগিন দেখেছি (যা আমি বর্তমানে সনাক্ত করতে পারি না) যা বিভিন্ন ধরণের সিএসএস নির্বাচক এবং তাদের চেহারাটি প্রদর্শন করে এমন ধরণের একটি ডেমো পৃষ্ঠা দেখায় তবে আমি বিশ্বাস করি এটি পুরানো ছিল। তা ছাড়া, আপনার আপাতত সর্বোত্তম বিকল্পটি হতে পারে কেবল ফায়ারব্যাগ / ওয়েব ইন্সপেক্টরকে সরিয়ে দেওয়া এবং ডাব্লুপি-অ্যাডমিন / সিএসএস / ডাব্লুপি-অ্যাডমিন.দেউসিএসএস দেখুন।


আপনাকে ধন্যবাদ, আমি এখন পর্যন্ত কিছু ছোট জিনিসগুলিতে ফায়ারব্যাগ সমাধানটি ব্যবহার করেছি। এটি ঠিক আছে তবে আইডি আপনার কাছ থেকে পাওয়া দুটি তালিকার উদাহরণের মতো আরও কিছু পছন্দ করে এবং @ বাল্ট :) আপনাকে ধন্যবাদ!
ওলে হেনরিক স্কোগ্রাস্টম

2
এই সাইটের সামগ্রী এখন বেশ অচল।
বুর্গী

13

এই প্লাগইনটি ইনস্টল করুন এবং আপনি সমস্ত উপাদান, শ্রেণি এবং আইডি https://github.com/bueltge/WordPress-Admin-Style দেখুন


নিস! এটি একটি ভাল তালিকা, কিছু পরীক্ষা করা প্রয়োজন। আরও উত্তর এবং টিপস আশা করছি :) শীঘ্রই একটি উত্তর চয়ন করুন!
ওলে হেনরিক স্কোগ্রাস্টম

2

* দ্রষ্টব্য: সামনের দিকের জন্য - ওয়ার্ডপ্রেস ডিফল্ট সিএসএস শৈলীতে আমি প্রচুর গবেষণা ও উন্নয়নের পরে এনেছি এমন তালিকা এখানে। আমি সবকিছু নিয়ে গবেষণা এবং যথাসম্ভব যথাযথভাবে সংগঠিত করার জন্য যথাসাধ্য চেষ্টা করেছি। যদি আপনি কিছু অনুপস্থিত বা অসম্পূর্ণ দেখেন তবে দয়া করে মন্তব্যে লিখুন। আমি আশা করি এটি আপনার পছন্দসই প্লাগইন এবং থিমগুলি বিকাশ করতে সহায়তা করতে পারে *

/* WP WYSIWYG Editor Styles */

.entry-content img {
    margin: 0 0 1.5em 0;
    }

.alignleft, img.alignleft {
    margin-right: 1.5em;
    display: inline;
    float: left;
    }
.alignright, img.alignright {
    margin-left: 1.5em;
    display: inline;
    float: right;
    }
.aligncenter, img.aligncenter {
    margin-right: auto;
    margin-left: auto;
    display: block;
    clear: both;
    }
.alignnone, img.alignnone {}
.wp-caption {
    margin-bottom: 1.5em;
    text-align: center;
    padding-top: 5px;
    }
.wp-caption img {
    border: 0 none;
    padding: 0;
    margin: 0;
    }
.wp-caption p.wp-caption-text {
    line-height: 1.5;
    font-size: 10px;
    margin: 0;
    }
.wp-smiley {
    margin: 0 !important;
    max-height: 1em;
    }
blockquote.left {
    margin-right: 20px;
    text-align: right;
    margin-left: 0;
    width: 33%;
    float: left;
    }
blockquote.right {
    margin-left: 20px;
    text-align: left;
    margin-right: 0;
    width: 33%;
    float: right;
    }
.gallery dl {}
.gallery dt {}
.gallery dd {}
.gallery dl a {}
.gallery dl img {}
.gallery-caption {}

.size-full {}
.size-large {}
.size-medium {}
.size-thumbnail {}

/* WP CSS - Miscellaneous Styles */

/* category links */
 li.categories {}  
 li.cat-item {}
 li.cat-item-{id} {}
 li.current-cat {}
 li.current-cat-parent {}
 ul.children {}

/* blogroll links */
.linkcat {}
.blogroll {}

/* read-more links */
.more-link {}

/* WP CSS - Page Listings */

.pagenav {}               /* outermost list item */
.page_item {}             /* any page item */
.page-item-{id} {}        /* specific page id */
.current_page_item {}     /* current page */
.current_page_parent {}   /* parent of current page */
.current_page_ancestor {} /* any ancestor of current page */

.pagenav ul,
.pagenav .current_page_item ul,
.pagenav .current_page_ancestor ul,
.pagenav .current_page_ancestor .current_page_item ul,
.pagenav .current_page_ancestor .current_page_ancestor ul,
.pagenav .current_page_ancestor .current_page_ancestor .current_page_item ul,
.pagenav .current_page_ancestor .current_page_ancestor .current_page_ancestor ul {}

.pagenav  ul ul,
.pagenav .current_page_item ul ul,
.pagenav .current_page_ancestor ul ul,
.pagenav .current_page_ancestor .current_page_item ul ul,
.pagenav .current_page_ancestor .current_page_ancestor ul ul {}
.pagenav .current_page_ancestor .current_page_ancestor .current_page_item ul ul, 
.pagenav .current_page_ancestor .current_page_ancestor .current_page_ancestor ul ul {}

/* WP CSS - Default WordPress Widgets */

.widget {}

/* links widget */
.widget_links {}
.widget_links ul {}
.widget_links ul li {}
.widget_links ul li a {}

/* meta widget */
.widget_meta {}
.widget_meta ul {}
.widget_meta ul li {}
.widget_meta ul li a {}

/* pages widget */
.widget_pages {}
.widget_pages ul {}
.widget_pages ul li {}
.widget_pages ul li a {}

/* recent-posts widget */
.widget_recent_entries {}
.widget_recent_entries ul {}
.widget_recent_entries ul li {}
.widget_recent_entries ul li a {}

/* archives widget */
.widget_archive {}
.widget_archive ul {}
.widget_archive ul li {} 
.widget_archive ul li a {}
.widget_archive select {}
.widget_archive option {}

/* tag-cloud widget */
.widget_links {}
.widget_links li:after {}
.widget_links li:before {}
.widget_tag_cloud {}
.widget_tag_cloud a {}
.widget_tag_cloud a:after {}
.widget_tag_cloud a:before {}

/* calendar widget */
.widget_calendar {}
#calendar_wrap {}
#calendar_wrap th {}
#calendar_wrap td {}
#wp-calendar tr td {}
#wp-calendar caption {}
#wp-calendar a {}
#wp-calendar #today {}
#wp-calendar #prev {}
#wp-calendar #next {}
#wp-calendar #next a {}
#wp-calendar #prev a {}

/* category widget */
.widget_categories {}
.widget_categories ul {}
.widget_categories ul li {} 
.widget_categories ul ul.children {}
.widget_categories a {}
.widget_categories select{}
.widget_categories select#cat {}
.widget_categories select.postform {}
.widget_categories option {}
.widget_categories .level-0 {}
.widget_categories .level-1 {}
.widget_categories .level-2 {}
.widget_categories .level-3 {}

/* recent-comments widget */
.recentcomments {}
#recentcomments {}
#recentcomments li {}
#recentcomments li a {}
.widget_recent_comments {}

/* search widget */
#searchform {}
.widget_search {}
.screen-reader-text {}

/* text widget */
.textwidget {}
.widget_text {}
.textwidget p {}

/* WP CSS - Comment Styles */

.commentlist .reply {}
.commentlist .reply a {}

.commentlist .alt {}
.commentlist .odd {}
.commentlist .even {}
.commentlist .thread-alt {}
.commentlist .thread-odd {}
.commentlist .thread-even {}
.commentlist li ul.children .alt {}
.commentlist li ul.children .odd {}
.commentlist li ul.children .even {}

.commentlist .vcard {}
.commentlist .vcard cite.fn {}
.commentlist .vcard span.says {}
.commentlist .vcard img.photo {}
.commentlist .vcard img.avatar {}
.commentlist .vcard cite.fn a.url {}

.commentlist .comment-meta {} 
.commentlist .comment-meta a {}
.commentlist .commentmetadata {}
.commentlist .commentmetadata a {}

.commentlist .parent {}
.commentlist .comment {}
.commentlist .children {}
.commentlist .pingback {}
.commentlist .bypostauthor {}
.commentlist .comment-author {}
.commentlist .comment-author-admin {}

.commentlist {}
.commentlist li {}
.commentlist li p {}
.commentlist li ul {}
.commentlist li ul.children li {}
.commentlist li ul.children li.alt {}
.commentlist li ul.children li.byuser {}
.commentlist li ul.children li.comment {}
.commentlist li ul.children li.depth-{id} {}
.commentlist li ul.children li.bypostauthor {}
.commentlist li ul.children li.comment-author-admin {}

#cancel-comment-reply {}
#cancel-comment-reply a {}

/* WP CSS - body_class() */

.rtl {}
.home {}
.blog {}
.archive {}
.date {}
.search {}
.paged {}
.attachment {}
.error404 {}
.single postid-(id) {}
.attachmentid-(id) {}
.attachment-(mime-type) {}
.author {}
.author-(user_nicename) {}
.category {}
.category-(slug) {}
.tag {}
.tag-(slug) {}
.page-parent {}
.page-child parent-pageid-(id) {}
.page-template page-template-(template file name) {}
.search-results {}
.search-no-results {}
.logged-in {}
.paged-(page number) {}
.single-paged-(page number) {}
.page-paged-(page number) {}
.category-paged-(page number) {}
.tag-paged-(page number) {}
.date-paged-(page number) {}
.author-paged-(page number) {}
.search-paged-(page number) {}

/* WP CSS - post_class() */

.post-id {}
.post {}
.page {}
.attachment {}
.sticky {}
.hentry {}
.category-misc {}
.category-example {}
.tag-news {}
.tag-wordpress {}
.tag-markup {}

আমি আপনার তালিকাটি সত্যই বুঝতে পারি না, এটি কি খালি আইডি / ক্লাসগুলির একটি তালিকা যাতে আমি নিজে ওয়ার্ডপ্রেস সিএসএস শৈলীটি কাস্টমাইজ করতে পারি?
ওলে হেনরিক স্কোগ্রাস্টম

এটি চিত্রগুলির জন্য সমস্ত শ্রেণীর তালিকা, যদি আপনি বিষয়বস্তুটিতে এটি বিভিন্ন উপায়ে অন্তর্ভুক্ত করেন; লেফট বা ডানদিকে প্রান্তিককরণের মতো ভাসমান মাধ্যমে at আমার মনে হয় ওয়েবের কোনও পোস্ট থেকে কেবল একটি অনুলিপি?
বুলেটেজ

0

ওয়ার্ডপ্রেস ব্যাকএন্ড "বডি" ক্লাস তৈরি করেছে। আমি এই স্পষ্টভাবে নথিযুক্ত কোথাও কখনও দেখিনি (যদিও আমি এটি ভালভাবে মিস করতে পারি)। আপনি তাদের এবং কীভাবে admin-header.phpউত্সে উত্পন্ন হয় তা দেখতে পারেন ।

উত্পন্ন ক্লাসগুলি ফ্রন্ট-এন্ডের সাথে খুব মিল:

<body class="wp-admin no-js  upload-php admin-bar branch-3-3 version-3-3-1 admin-color-fresh">

0

আমি এই প্রশ্নে পেয়েছি কারণ আমি add_menu_page () ব্যবহার করে একটি কাস্টম প্রশাসক পৃষ্ঠা তৈরি করছিলাম । আপনি আপনার কন্টেন্টের মধ্যে রাখতে চান

<div class = "wrap">Your content.</div>

এটি স্ট্যান্ডার্ড ওয়ার্ডপ্রেস অ্যাডমিন ব্যাকএন্ড সিএসএসকে সক্রিয় করবে যাতে আপনার কাস্টম অ্যাডমিন পৃষ্ঠাটি স্বাভাবিক দেখায়। এই ক্ষেত্রে অন্যান্য ডিভাইসগুলি স্বয়ংক্রিয়ভাবে ওয়ার্ডপ্রেস দ্বারা পরিচালিত হবে।

class AdminScreen{

    public function __construct(){
        add_action( 'admin_menu', array( $this, 'doAddMenuPage' ) );
    }

    public function doAddMenuPage(){
        add_menu_page( "AdminScreen", "AdminScreen", 'edit_others_pages', 'AdminScreen', array($this, 'echoAdminPage') );
    }

    public function echoAdminPage(){        
        //Prints out the HTML into the output buffer:
        echo '<div class = "wrap"><h1 class = "wp-heading-inline">This looks good, finally!</h1></div>';
    }
}

0

এখানে অন্য একটি আকর্ষণীয় নিবন্ধ যা প্রশাসনিক পৃষ্ঠায় স্টাইলিংয়ের জন্য উপলব্ধ সমস্ত উপলব্ধ সিএসএস শ্রেণি / এইচটিএমএল মার্কআপের তালিকা তৈরির একটি শালীন কাজ করে makes নিবন্ধগুলি সামান্য পুরানো হয়েছে যাতে এটি ওয়ার্ডপ্রেসের পুরানো সংস্করণ থেকে স্টাইলিং ফলাফল দেখায়, সম্ভবত এটির পরে সম্ভবত অতিরিক্ত ক্লাস যুক্ত করা হয়েছে।

আর একটি দরকারী সংস্থান ওয়ার্ডপ্রেস ড্যাশিকনস

তবে, আমাকে নীচে তালিকাভুক্ত তার দুর্দান্ত প্লাগইনটিতে @ বেল্টজকে অভিনন্দন জানাতে হবে যা অ্যাডমিন স্টাইলগুলির আপডেট রেফারেন্স রাখার দুর্দান্ত কাজ করে।

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.