VSCode ஐ அல்டிமேட் மார்க் டவுன் எடிட்டராக மாற்றுவது எப்படி

VSCode ஐ அல்டிமேட் மார்க் டவுன் எடிட்டராக மாற்றுவது எப்படி

நீங்கள் இணையத்தில் எழுதினால், மார்க் டவுனைப் பார்க்க வேண்டும். இணைய எழுத்தாளர்களுக்கு உதவும் ஏராளமான மார்க் டவுன் பயன்பாடுகள் உள்ளன. ஆனால் மைக்ரோசாப்டின் விஷுவல் ஸ்டுடியோ கோட் (VSCode) போன்ற இலவச குறியீடு எடிட்டர்கள் இன்னும் சக்திவாய்ந்ததாக இருக்கும்.





VSCode மார்க் டவுனைப் புரிந்துகொள்கிறது மற்றும் அதை HTML இல் முன்னோட்டமிடுவதற்கான உள்ளமைக்கப்பட்ட கருவிகளைக் கொண்டுள்ளது. இருப்பினும், சொல் எண்ணிக்கை மற்றும் எழுத்துப்பிழை சரிபார்ப்பு போன்ற சொல் செயலி செயல்பாட்டை நீங்கள் சேர்க்கலாம். முன்னோட்டத்திற்கான இணையதளம் சார்ந்த தனிப்பயனாக்கங்களையும் நீங்கள் இயக்க விரும்பலாம்.





அன்றைய வீடியோவை உருவாக்கவும்

இறுதியாக, மார்க் டவுனை HTML ஆக நகலெடுக்கும் திறன் அவசியம், எனவே நீங்கள் அதை உள்ளடக்க மேலாண்மை அமைப்பில் (CMS) சுத்தமாக ஒட்டலாம்.





VSCode ஐ பதிவிறக்கி நிறுவவும்

தொடங்குவதற்கு, VSCode அல்லது அதன் திறந்த மூல மாற்று VSCodium ஐப் பதிவிறக்கவும். ஒவ்வொன்றின் பதிப்புகளும் அனைத்து முக்கிய டெஸ்க்டாப் இயக்க முறைமைகளுக்கும் கிடைக்கின்றன.

இன்ஸ்டாகிராமில் dms ஐ ஆன்லைனில் சரிபார்க்க முடியுமா?

நீங்கள் ஒருமுறை பதிவிறக்கம் செய்து VSCode நிறுவப்பட்டது , தொடங்குவதற்கு பயன்பாட்டை இயக்கவும்.



  VSCode இயல்புநிலை வரவேற்புத் திரை.

வார்த்தை எண்ணிக்கை நீட்டிப்பை நிறுவவும்

வார்த்தை கவுண்டரைச் சேர்ப்பதன் மூலம் தொடங்கவும். இதைக் கையாளும் பல நீட்டிப்புகள் உள்ளன. உண்மையான வார்த்தைகள் மற்றும் குறியீடு அல்லது கோப்புப் பெயர்களுக்கு இடையே சிறப்பாக வேறுபடுத்துவது மைக்ரோசாப்டின் சொந்த வேர்ட் கவுண்டர் நீட்டிப்பாகும்.

பதிவிறக்க Tamil: சொல் எண்ணிக்கை VSCode நீட்டிப்பு (இலவசம்)





  1. கிளிக் செய்யவும் பதிவிறக்க நீட்டிப்பு கீழ் வளங்கள் கீழ் வலது கை பலகத்தில்.
  2. பதிவிறக்கம் செய்தவுடன், VSCodeக்கு மாறவும்.
  3. கிளிக் செய்யவும் கியர் ஐகான் இடைமுகத்தின் கீழ் இடது மூலையில்.
  4. கிளிக் செய்யவும் நீட்டிப்புகள் .
  5. நீள்வட்டத்தைக் கிளிக் செய்யவும் ( ... ) நீட்டிப்புகள் பலகத்தின் மேல் அருகில்.
  6. கிளிக் செய்யவும் VSIX இலிருந்து நிறுவவும் .   மைக்ரோசாப்ட் வழங்கும் வேர்ட் கவுண்ட் நீட்டிப்புடன் கூடிய VSCode மாதிரி ஆவணத்தில் உள்ள வார்த்தைகளின் எண்ணிக்கையைக் கண்டறிவதைக் காட்டுகிறது.
  7. தேர்ந்தெடு ms-vcode.wordcount-*.vsix நீங்கள் பதிவிறக்கிய கோப்பு.

தி சொல் எண்ணிக்கை நீட்டிப்பு இப்போது நிறுவப்பட வேண்டும். புதிய மார்க் டவுன் கோப்பைத் திறந்து தட்டச்சு செய்வதன் மூலம் அதைச் சோதிக்கவும். நீங்கள் இப்போது இடைமுகத்தின் கீழ் இடது புறத்தில் ஒரு வார்த்தை கவுண்டரைப் பார்க்க வேண்டும்:

  VSCodeல் ஒரு மார்க் டவுன் ஆவணம் திறந்திருக்கும், அதில் எழுத்துப்பிழைகள் ஒரு மென்மையான நீல நிற squiggly அடிக்கோடு மூலம் கண்டறியப்பட்டது.

எழுத்துப்பிழை சரிபார்ப்பு நீட்டிப்பை நிறுவவும்

நீங்கள் எழுத்துப்பிழை சரிபார்ப்பு செயல்பாட்டையும் சேர்க்க வேண்டும். வார்த்தை கவுண்டர்களைப் போலவே, எழுத்துப்பிழை சரிபார்ப்பைக் கையாளும் பல நீட்டிப்புகள் உள்ளன. மிகவும் பிரபலமானது குறியீடு எழுத்துப்பிழை சரிபார்ப்பு ஸ்ட்ரீட் சைட் மென்பொருளால் பல மொழிகளில் கிடைக்கிறது.





பதிவிறக்க Tamil: குறியீடு எழுத்துப்பிழை சரிபார்ப்பு VSCode நீட்டிப்பு (இலவசம்)

  1. மேலே உள்ள பிரிவில் இருந்து 1 முதல் 6 வரையிலான படிகளைப் பின்பற்றவும்.
  2. தேர்ந்தெடு streetsidesoftware.code-spell-checker-*.vsix நீங்கள் பதிவிறக்கிய கோப்பு.

தி குறியீடு எழுத்துப்பிழை சரிபார்ப்பு நீட்டிப்பு இப்போது நிறுவப்பட வேண்டும். புதிய மார்க் டவுன் கோப்பைத் திறந்து, எழுத்துப்பிழை உள்ள வார்த்தைகளைத் தட்டச்சு செய்வதன் மூலம் அதைச் சோதிக்கவும்.

  நான்கு எழுத்துப் பிழைகளைக் காட்டும் காட்டி VSCode நிலைப் பட்டியின் கீழ் வலது புறம்.

இடைமுகத்தின் கீழ் வலது புறத்தில் உள்ள பிழைகளின் எண்ணிக்கையுடன் அந்த வார்த்தைகளின் கீழ் நீல நிற ஸ்க்விகிளி வரியைக் காண வேண்டும்:

  VSCode settings.json கோப்பு தனிப்பயன் குறியீடு சேர்க்கப்பட்டதுடன் திறக்கப்பட்டது.

Error Squiggle ஐத் தனிப்பயனாக்கு

இந்த எழுத்துப்பிழை சரிபார்ப்பு நீட்டிப்பின் மிகப்பெரிய சிக்கல், பிழைகளை அடையாளம் காணும் ஸ்க்விகிளுக்கு பயன்படுத்தப்படும் பலவீனமான நீல நிறமாகும். இது இருண்ட கருப்பொருள்களின் பின்னணியில் கலக்க முனைகிறது மற்றும் பிற மார்க் டவுன் கூறுகளுக்கு மீண்டும் பயன்படுத்தப்படுகிறது.

வேர்ட் ப்ராசசரில் நீங்கள் எதிர்பார்ப்பது போல் இதை ஒரு தடித்த சிவப்பு நிறத்திற்கு மாற்ற முயற்சி செய்யலாம்:

  1. கிளிக் செய்யவும் கியர் ஐகான் இடைமுகத்தின் கீழ் இடது மூலையில்.
  2. கிளிக் செய்யவும் அமைப்புகள் .
  3. கிளிக் செய்யவும் வொர்க் பெஞ்ச் , பிறகு தோற்றம் .
  4. கீழே உருட்டவும் வண்ண தனிப்பயனாக்கம் :   VSCodeல் ஒரு மார்க் டவுன் ஆவணம் திறந்திருக்கும், தெளிவான எழுத்துப்பிழைகளுடன் வலுவான சிவப்பு நிற squiggly அடிக்கோடு கண்டறியப்பட்டது.
  5. கிளிக் செய்யவும் settings.json இல் திருத்தவும் .
  6. புதிய தாவலில் திறக்கும் எடிட்டரில் பின்வரும் குறியீட்டை ஒட்டவும்:
    "editorInfo.foreground": "#ff0000"
      மூன்று எழுத்துப் பிழைகளுடன் VSCodeல் திறக்கப்பட்ட ஒரு மார்க் டவுன் ஆவணம்.
  7. மற்றும் கோப்பை சேமிக்கவும்.

இப்போது நீங்கள் ஒரு வார்த்தையை தவறாக எழுதினால், VSCode அதை பிரகாசமான சிவப்பு நிறத்தில் அலங்கரிக்கும்:

  சரியாக வடிவமைக்கப்பட்ட HTML ஆவணம் VSCode இல் திறக்கப்பட்டுள்ளது.

தவறான நேர்மறைகளை புறக்கணித்தல்

எழுத்துப்பிழை சரிபார்ப்பவர் சில தொழில் சார்ந்த சொற்கள் அல்லது நிறுவனத்தின் பெயர்கள் போன்ற சரியான பெயர்ச்சொற்களை அடையாளம் காண முடியாது. மேலே உள்ள ஸ்கிரீன்ஷாட்டில், எடுத்துக்காட்டாக, VSCode 'டிஸ்ட்ரோ' என்ற சுருக்கத்தை எழுத்துப்பிழையாக எடுத்துக்காட்டுகிறது.

இந்த வார்த்தைகளை பிழையாகப் பார்ப்பதை நிறுத்த, அவற்றை உங்களுடன் சேர்க்க வேண்டும் பயனர் அமைப்புகள் .

  1. எழுத்துப்பிழை சரிபார்ப்பவர் புறக்கணிக்க விரும்பும் வார்த்தையின் மீது வலது கிளிக் செய்யவும்.
  2. மேலே வட்டமிடுங்கள் எழுத்துப்பிழை மற்றும் தேர்ந்தெடுக்கவும் பயனர் அமைப்புகளில் வார்த்தைகளைச் சேர்க்கவும் .   இந்தக் கட்டுரை மார்க் டவுன் கோப்பாக VSCode இல் இயல்புநிலை முன்னோட்டத்துடன் திறக்கப்பட்டுள்ளது.

இனிமேல், எழுத்துப்பிழை சரிபார்ப்பு இந்த வார்த்தைகள் தவறானவை என அடையாளம் காணாது:

  VSCode அமைப்புகள் > நீட்டிப்புகள் > மார்க் டவுன் > மார்க் டவுன்: ஸ்டைல்கள் மெனு.

நகல் மார்க் டவுனை HTML நீட்டிப்பாக நிறுவவும்

அடுத்து, நகல் மார்க் டவுனை HTML நீட்டிப்பாக நிறுவவும், இதன் மூலம் நீங்கள் வடிவமைக்கப்பட்ட மார்க் டவுனை நகலெடுத்து ஒட்டலாம்.

பதிவிறக்க Tamil: மார்க் டவுனை HTML ஆக நகலெடுக்கவும் VSCode நீட்டிப்பு (இலவசம்)

  1. மேலே உள்ள பகுதிகளிலிருந்து 1 முதல் 6 வரையிலான படிகளைப் பின்பற்றவும்.
  2. தேர்ந்தெடு jerriepelser.copy-markdown-as-html-1.1.0.vsix நீங்கள் பதிவிறக்கிய கோப்பு.

இப்போது நீங்கள் VSCode இலிருந்து Markdown ஐ நகலெடுத்து CMS இல் சுத்தமான HTML ஆக ஒட்ட முடியும். இதைச் சோதிக்க:

  1. சில மார்க் டவுன் உரையைத் தேர்ந்தெடுக்கவும்.
  2. திற கட்டளை தட்டு இல் காண்க மெனு, அல்லது அழுத்துவதன் மூலம் CTRL+Shift+P .
  3. தேர்வு செய்யவும் மார்க் டவுன்: HTML ஆக நகலெடுக்கவும் :   MUO போலத் தனிப்பயனாக்கப்பட்ட முன்னோட்டத்துடன் VSCode இல் திறக்கப்பட்ட மார்க் டவுன் கோப்பாக இந்தக் கட்டுரை உள்ளது.
  4. நகலெடுக்கப்பட்ட மார்க் டவுனை புதிய HTML கோப்பில் ஒட்டவும்.

நகலெடுக்கப்பட்ட மார்க் டவுன் சரியாக HTML ஆக ஒட்டப்பட்டுள்ளதை நீங்கள் பார்க்க வேண்டும்:

  ஒளி தீமில் VSCode வரவேற்புத் திரை.

முன்னோட்டப் பலகத்தைத் தனிப்பயனாக்குதல்

இயல்பாக, முன்னோட்ட பலகம் தற்போதைய VSCode தீம் போன்ற அதே பாணியைக் கொண்டிருக்கும்.

  இந்த கட்டுரையின் மார்க் டவுன் huacat மூலம் Office தீம் மூலம் VSCode இல் திறக்கப்பட்டது.

இருப்பினும், உங்கள் உள்ளடக்கத்தின் இறுதி இலக்கை மிகவும் நெருக்கமாகப் பிரதிபலிக்கும் வகையில் முன்னோட்டங்களை நீங்கள் விரும்பலாம். உங்கள் மார்க் டவுன் ஏற்கனவே நீங்கள் வெளியிடும் இணையதளத்தில் இருப்பது போல் தோற்றமளிக்க, முன்னோட்டப் பலகத்தைத் தனிப்பயனாக்கலாம்.

நீங்கள் விரும்பும் எந்த வலைத்தளத்தையும் பயன்படுத்தலாம்; பின்வரும் பாணிகள் MUO இலிருந்து எடுக்கப்பட்டது. வெறும் எழுத்துருக்களைக் கண்டறிய உங்கள் உலாவியின் ஆய்வு உறுப்புக் கருவியைப் பயன்படுத்தவும் மற்றும் எந்த வலைத்தளத்திலிருந்தும் வண்ணங்களைத் தேர்ந்தெடுக்கவும் .

  1. ஒரு புதிய கோப்பை உருவாக்கி அதற்குப் பெயரிடுங்கள் ' CustomStyles.css '
  2. பின்வரும் எடுத்துக்காட்டு CSS குறியீட்டை கோப்பில் ஒட்டவும்:
    body { 
    background-color: #fff;
    color: #2c2c2c;
    font-family: Roboto;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.7em;
    max-width: 750px;
    }

    h1 {
    font-size: 38px;
    font-weight: 800;
    }

    h2 {
    font-size: 34px;
    font-weight: 700;
    }

    h3 {
    font-size: 24px;
    font-weight: 700;
    }

    a {
    border-bottom: 2px solid #bf0d0b;
    color: #bf0d0b;
    font-weight: 700;
    }

    a:hover {
    color: #fff;
    background: #bf0d0b;
    }

    strong {
    font-weight: bold;
    }
  3. மற்றும் கோப்பை சேமிக்கவும்.
  4. கிளிக் செய்யவும் கியர் ஐகான் இடைமுகத்தின் கீழ் இடது மூலையில்.
  5. கிளிக் செய்யவும் அமைப்புகள் .
  6. கிளிக் செய்யவும் நீட்டிப்புகள் பின்னர் மார்க் டவுன் .
  7. கீழே உருட்டவும் மார்க் டவுன்: பாங்குகள் மற்றும் கிளிக் செய்யவும் பொருளைச் சேர்க்கவும் .
  8. உங்கள் பாதையை உள்ளிடவும் CustomStyles.css கோப்பு, எடுத்துக்காட்டாக:
    C:\Users\Adam\CustomStyles.css
      Equinusocio இன் மெட்டீரியல் கருப்பொருளைப் பயன்படுத்தி VSCode இல் இந்தக் கட்டுரையின் மார்க் டவுன் திறக்கப்பட்டது.
  9. கிளிக் செய்யவும் சரி .

நீங்கள் இவற்றைச் செய்தவுடன், இந்தக் கட்டுரையைப் போலவே தோற்றமளிக்கும் முன்னோட்டப் பலகத்துடன் முடிவடையும்.

மீண்டும், MUO இல் எனது உலாவியின் இன்ஸ்பெக்ட் எலிமென்ட் கருவியைப் பயன்படுத்தி இந்த மதிப்புகளைப் பெற்றேன், ஆனால் உங்கள் சொந்த இலக்கு இணையதளத்திற்கான மதிப்புகளை நீங்கள் கண்டுபிடிக்க வேண்டும்.

எடிட்டர் தீம்கள்

இயல்புநிலை VSCode தீம் இருண்ட மற்றும் ஒளி இரண்டிலும் வருகிறது, ஒவ்வொன்றின் உயர்-மாறுபட்ட பதிப்புகளுடன். ஆனால் எந்த நல்ல குறியீடு எடிட்டரைப் போலவே, உள்ளன ஒரு டன் சிறந்த மூன்றாம் தரப்பு தீம்கள் உள்ளன .

குறியீடு எடிட்டரை விட வேர்ட் ப்ராசசரின் தோற்றத்தை நீங்கள் விரும்பினால், Huacat மூலம் Office தீமைப் பரிந்துரைக்கிறேன்:

குறியீடு எடிட்டரை நீங்கள் விரும்பினால், டிராகுலா, க்ருவ்பாக்ஸ், மெட்டீரியல் (கீழே உள்ள ஸ்கிரீன்ஷாட்டைப் பார்க்கவும்) மற்றும் நார்ட் போன்ற பொதுவான தீம்கள் அனைத்தும் நீட்டிப்பு சந்தையில் கிடைக்கும்.

புதிய தீம் ஒன்றை நிறுவ:

  1. கிளிக் செய்யவும் கியர் ஐகான் இடைமுகத்தின் கீழ் இடது மூலையில்.
  2. கிளிக் செய்யவும் நீட்டிப்புகள் .
  3. மேலே குறிப்பிட்டுள்ள தீம்களில் ஏதேனும் ஒன்றைத் தேடவும் அல்லது வகையை வடிகட்டவும் கருப்பொருள்கள் மற்றும் கிடைக்கக்கூடியவற்றை உலாவவும்.

VSCode அல்டிமேட் மார்க் டவுன் எடிட்டரா?

எனவே, VSCode இணைய உள்ளடக்கத்திற்கான இறுதி மார்க் டவுன் எடிட்டரா? பெட்டிக்கு வெளியே, அநேகமாக இல்லை. ஆனால் அது எதையும் முடிந்தவரை நீட்டிக்கக்கூடியது.

வார்த்தை கவுண்டர்கள், எழுத்துப்பிழை சரிபார்ப்புகள், மார்க் டவுனை HTML ஆக நகலெடுக்கவும், தனிப்பயனாக்கங்களை முன்னோட்டமிடவும் மற்றும் தீம்கள் மேற்பரப்பைக் கீறிவிடும். VSCodeக்கான நீட்டிப்புகள் நிறைந்த சுற்றுச்சூழல் அமைப்பு உள்ளது, அதை நீங்கள் சொந்தமாக்கிக் கொள்ளலாம்.