[{"data":1,"prerenderedAt":1168},["ShallowReactive",2],{"navigation":3,"/docs/studio/content":179,"xXUV5hgjGn":1155},[4,24,43,61,83,101,119,149],{"title":5,"path":6,"stem":7,"children":8,"icon":23},"Getting Started","/docs/getting-started","docs/1.getting-started/1.index",[9,11,15,19],{"title":10,"path":6,"stem":7},"Introduction",{"title":12,"path":13,"stem":14},"Installation","/docs/getting-started/installation","docs/1.getting-started/2.installation",{"title":16,"path":17,"stem":18},"Configuration","/docs/getting-started/configuration","docs/1.getting-started/3.configuration",{"title":20,"path":21,"stem":22},"Migration","/docs/getting-started/migration","docs/1.getting-started/4.migration","i-lucide-square-play",{"title":25,"icon":26,"path":27,"stem":28,"children":29,"page":42},"Collections","i-lucide-database","/docs/collections","docs/2.collections",[30,34,38],{"title":31,"path":32,"stem":33},"Define","/docs/collections/define","docs/2.collections/1.define",{"title":35,"path":36,"stem":37},"Types","/docs/collections/types","docs/2.collections/2.types",{"title":39,"path":40,"stem":41},"Sources","/docs/collections/sources","docs/2.collections/3.sources",false,{"title":44,"icon":45,"path":46,"stem":47,"children":48,"page":42},"Files","i-lucide-file","/docs/files","docs/3.files",[49,53,57],{"title":50,"path":51,"stem":52},"Markdown","/docs/files/markdown","docs/3.files/1.markdown",{"title":54,"path":55,"stem":56},"YAML","/docs/files/yaml","docs/3.files/2.yaml",{"title":58,"path":59,"stem":60},"JSON","/docs/files/json","docs/3.files/3.json",{"title":62,"icon":63,"path":64,"stem":65,"children":66,"page":42},"Query Utils","i-lucide-square-function","/docs/utils","docs/4.utils",[67,71,75,79],{"title":68,"path":69,"stem":70},"queryCollection","/docs/utils/query-collection","docs/4.utils/1.query-collection",{"title":72,"path":73,"stem":74},"queryCollectionNavigation","/docs/utils/query-collection-navigation","docs/4.utils/2.query-collection-navigation",{"title":76,"path":77,"stem":78},"queryCollectionItemSurroundings","/docs/utils/query-collection-item-surroundings","docs/4.utils/3.query-collection-item-surroundings",{"title":80,"path":81,"stem":82},"queryCollectionSearchSections","/docs/utils/query-collection-search-sections","docs/4.utils/4.query-collection-search-sections",{"title":84,"icon":85,"path":86,"stem":87,"children":88,"page":42},"Components","i-lucide-square-code","/docs/components","docs/5.components",[89,93,97],{"title":90,"path":91,"stem":92},"ContentRenderer","/docs/components/content-renderer","docs/5.components/0.content-renderer",{"title":94,"path":95,"stem":96},"Slot","/docs/components/slot","docs/5.components/1.slot",{"title":98,"path":99,"stem":100},"Prose Components","/docs/components/prose","docs/5.components/2.prose",{"title":102,"icon":103,"path":104,"stem":105,"children":106,"page":42},"Deploy","i-lucide-cloud-upload","/docs/deploy","docs/6.deploy",[107,111,115],{"title":108,"path":109,"stem":110},"Server","/docs/deploy/server","docs/6.deploy/1.server",{"title":112,"path":113,"stem":114},"Serverless","/docs/deploy/serverless","docs/6.deploy/2.serverless",{"title":116,"path":117,"stem":118},"Static","/docs/deploy/static","docs/6.deploy/3.static",{"title":120,"icon":121,"path":122,"stem":123,"children":124,"page":42},"Advanced","i-lucide-code-xml","/docs/advanced","docs/7.advanced",[125,129,133,137,141,145],{"title":126,"path":127,"stem":128},"Full-Text Search","/docs/advanced/fulltext-search","docs/7.advanced/1.fulltext-search",{"title":130,"path":131,"stem":132},"Raw Content","/docs/advanced/raw-content","docs/7.advanced/2.raw-content",{"title":134,"path":135,"stem":136},"SQL Storage","/docs/advanced/database","docs/7.advanced/3.database",{"title":138,"path":139,"stem":140},"Debugging tools","/docs/advanced/tools","docs/7.advanced/4.tools",{"title":142,"path":143,"stem":144},"Hooks","/docs/advanced/hooks","docs/7.advanced/5.hooks",{"title":146,"path":147,"stem":148},"Custom Source","/docs/advanced/custom-source","docs/7.advanced/6.custom-source",{"title":150,"icon":151,"path":152,"stem":153,"children":154,"page":42},"Studio","i-lucide-monitor","/docs/studio","docs/8.studio",[155,159,163,167,171,175],{"title":156,"path":157,"stem":158},"Setup","/docs/studio/setup","docs/8.studio/1.setup",{"title":160,"path":161,"stem":162},"Synchronization","/docs/studio/github","docs/8.studio/2.github",{"title":164,"path":165,"stem":166},"Content editors","/docs/studio/content","docs/8.studio/3.content",{"title":168,"path":169,"stem":170},"Medias","/docs/studio/medias","docs/8.studio/4.medias",{"title":172,"path":173,"stem":174},"App Config","/docs/studio/config","docs/8.studio/5.config",{"title":176,"path":177,"stem":178},"Local Debug","/docs/studio/debug","docs/8.studio/6.debug",{"page":180,"surround":1150},{"id":181,"title":182,"body":183,"description":1143,"extension":1081,"links":1144,"meta":1145,"navigation":1146,"path":165,"seo":1147,"stem":166},"docs/docs/8.studio/3.content.md","Edit your content",{"type":184,"value":185,"toc":1124},"minimal",[186,190,224,230,238,246,253,256,262,267,277,284,290,294,297,300,303,322,332,336,343,348,351,833,837,844,847,856,1030,1038,1044,1051,1061,1067,1070,1076,1089,1092,1109,1120],[187,188,189],"p",{},"Nuxt Studio offers a versatile workspace for both developers and content writers, giving them the freedom to choose between our differents editors:",[191,192,193,206,217],"ul",{},[194,195,196,201,202,205],"li",{},[197,198,200],"a",{"href":199},"#notion-like-editor-markdown-files","Notion-like editor"," for ",[203,204,50],"code",{}," files",[194,207,208,201,212,214,215,205],{},[197,209,211],{"href":210},"#form-editor-yaml-and-json-files","Form editor",[203,213,54],{}," and ",[203,216,58],{},[194,218,219,223],{},[197,220,222],{"href":221},"#code-editor","Code editor"," for any kind of files (for technical users only)",[225,226,227],"tip",{},[187,228,229],{},"You can choose your favorite editor from the settings page of your project.",[187,231,232,233,237],{},"Each editor serves its own purpose. Some users are used to code edition, while others prefer a non-technical, visual approach. At the end, ",[234,235,236],"strong",{},"code syntax is the final output"," for both editors.",[239,240,242,243,245],"h2",{"id":241},"notion-like-editor-markdown-files","Notion-like editor (",[203,244,50],{}," files)",[187,247,248],{},[249,250],"img",{"alt":251,"src":252},"edit your website with a visual interface","/docs/studio/visual-markdown-editor.webp",[187,254,255],{},"This editor is heavily inspired by Notion, well known for its intuitive design and flexibility. Much like a standard text editor, this editor is designed to be familiar and easy to use. However, it stands out with its additional features that improve the writing experience.",[225,257,259],{"to":258},"/blog/visual-editor",[187,260,261],{},"You want to know how we've built this editor and how it works under the hood? Check this blog post.",[263,264,266],"h3",{"id":265},"frontmatter","Frontmatter",[187,268,269,272,273,276],{},[197,270,266],{"href":271},"/docs/files/markdown#frontmatter"," is a convention of Markdown-based CMS to provide meta-data to pages, like description or title or any other data you would like to store as ",[203,274,275],{},"key: value"," pair.",[187,278,279,280,283],{},"Based on the user ",[197,281,282],{"href":32},"collection and schema"," provided, a form is generated to edit this metadata from the editor.",[285,286],"video",{":autoplay":287,":controls":287,":loop":287,"poster":288,"src":289},"true","/home/videos/HomeNotionLikePoster.webp","https://res.cloudinary.com/nuxt/video/upload/v1729157955/frontmatterform2_rmh58v.mp4",[263,291,293],{"id":292},"toolbar","Toolbar",[187,295,296],{},"Highlight your text to reveal the toolbar, giving you access to all the standard text editing features (title formatting, Bold, Italic, Strike-through, code, link, class, bullet list, numerated list...).",[263,298,168],{"id":299},"medias",[187,301,302],{},"Users can simply drag and drop images directly into the editor. An upload modal will open to let you choose the destination folder.",[187,304,305,306,309,310,313,314,317,318,321],{},"By typing ",[203,307,308],{},"/"," and searching for ",[203,311,312],{},"Image"," or ",[203,315,316],{},"Video",", they can quickly insert a media. A modal will open to let them choose the media they want to insert from the media gallery (aka the",[203,319,320],{},"public"," folder of the Nuxt application).",[187,323,324,325,331],{},"From the media modal, you can set the ",[197,326,330],{"href":327,"rel":328},"https://www.w3schools.com/tags/att_img_alt.asp",[329],"nofollow","alt attribute"," for SEO and accessibility purpose.",[263,333,335],{"id":334},"vue-components","Vue Components",[187,337,338,339,342],{},"One of this editor standout features is its ability to integrate and customize any complex ",[203,340,341],{},"Vue"," component directly within the editor.",[344,345,347],"h4",{"id":346},"create-and-integrate-your-own-component","Create and integrate your own component",[187,349,350],{},"A developer can create any kind of visually complex components and editors will be able to use them and focus on the content. An editor can also play with the component properties, styles, and behaviour to fit its specific requirements as long as the developer made it customisable.",[352,353,355,359,366,729,737,796,800,810,816,825],"steps",{"level":354},"4",[344,356,358],{"id":357},"create-your-component","Create your component",[187,360,361,362,365],{},"You can create Vue components and integrate them into Markdown. They just need to be located in the ",[203,363,364],{},"/components/content"," folder to be available.",[367,368,374],"pre",{"className":369,"code":370,"filename":371,"language":372,"meta":373,"style":373},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Ctemplate>\n  \u003Cdiv class=\"flex items-start gap-3\">\n    \u003Cdiv class=\"flex items-center justify-center border rounded-lg p-1.5\">\n      \u003CUIcon :name=\"icon\" />\n    \u003C/div>\n    \u003Cdiv class=\"flex flex-col\">\n      \u003Ch3 class=\"font-semibold\">\n        \u003CContentSlot name=\"title\" />\n      \u003C/h3>\n      \u003Cspan>\n        \u003CContentSlot name=\"description\" />\n      \u003C/span>\n    \u003C/div>\n  \u003C/div>\n\u003C/template>\n\n\u003Cscript setup lang=\"ts\">\ndefineProps({\n  icon: {\n    type: String,\n    default: 'i-ph-cursor-click',\n  },\n})\n\u003C/script>\n","components/content/HomeFeature.vue","vue","",[203,375,376,392,419,440,464,474,494,514,537,547,556,576,585,594,604,614,621,646,660,672,686,705,711,720],{"__ignoreMap":373},[377,378,381,385,389],"span",{"class":379,"line":380},"line",1,[377,382,384],{"class":383},"s86vT","\u003C",[377,386,388],{"class":387},"sd2Uz","template",[377,390,391],{"class":383},">\n",[377,393,395,398,401,405,408,411,415,417],{"class":379,"line":394},2,[377,396,397],{"class":383},"  \u003C",[377,399,400],{"class":387},"div",[377,402,404],{"class":403},"s50WR"," class",[377,406,407],{"class":383},"=",[377,409,410],{"class":383},"\"",[377,412,414],{"class":413},"sIEYB","flex items-start gap-3",[377,416,410],{"class":383},[377,418,391],{"class":383},[377,420,422,425,427,429,431,433,436,438],{"class":379,"line":421},3,[377,423,424],{"class":383},"    \u003C",[377,426,400],{"class":387},[377,428,404],{"class":403},[377,430,407],{"class":383},[377,432,410],{"class":383},[377,434,435],{"class":413},"flex items-center justify-center border rounded-lg p-1.5",[377,437,410],{"class":383},[377,439,391],{"class":383},[377,441,443,446,449,452,454,456,459,461],{"class":379,"line":442},4,[377,444,445],{"class":383},"      \u003C",[377,447,448],{"class":387},"UIcon",[377,450,451],{"class":403}," :name",[377,453,407],{"class":383},[377,455,410],{"class":383},[377,457,458],{"class":413},"icon",[377,460,410],{"class":383},[377,462,463],{"class":383}," />\n",[377,465,467,470,472],{"class":379,"line":466},5,[377,468,469],{"class":383},"    \u003C/",[377,471,400],{"class":387},[377,473,391],{"class":383},[377,475,477,479,481,483,485,487,490,492],{"class":379,"line":476},6,[377,478,424],{"class":383},[377,480,400],{"class":387},[377,482,404],{"class":403},[377,484,407],{"class":383},[377,486,410],{"class":383},[377,488,489],{"class":413},"flex flex-col",[377,491,410],{"class":383},[377,493,391],{"class":383},[377,495,497,499,501,503,505,507,510,512],{"class":379,"line":496},7,[377,498,445],{"class":383},[377,500,263],{"class":387},[377,502,404],{"class":403},[377,504,407],{"class":383},[377,506,410],{"class":383},[377,508,509],{"class":413},"font-semibold",[377,511,410],{"class":383},[377,513,391],{"class":383},[377,515,517,520,523,526,528,530,533,535],{"class":379,"line":516},8,[377,518,519],{"class":383},"        \u003C",[377,521,522],{"class":387},"ContentSlot",[377,524,525],{"class":403}," name",[377,527,407],{"class":383},[377,529,410],{"class":383},[377,531,532],{"class":413},"title",[377,534,410],{"class":383},[377,536,463],{"class":383},[377,538,540,543,545],{"class":379,"line":539},9,[377,541,542],{"class":383},"      \u003C/",[377,544,263],{"class":387},[377,546,391],{"class":383},[377,548,550,552,554],{"class":379,"line":549},10,[377,551,445],{"class":383},[377,553,377],{"class":387},[377,555,391],{"class":383},[377,557,559,561,563,565,567,569,572,574],{"class":379,"line":558},11,[377,560,519],{"class":383},[377,562,522],{"class":387},[377,564,525],{"class":403},[377,566,407],{"class":383},[377,568,410],{"class":383},[377,570,571],{"class":413},"description",[377,573,410],{"class":383},[377,575,463],{"class":383},[377,577,579,581,583],{"class":379,"line":578},12,[377,580,542],{"class":383},[377,582,377],{"class":387},[377,584,391],{"class":383},[377,586,588,590,592],{"class":379,"line":587},13,[377,589,469],{"class":383},[377,591,400],{"class":387},[377,593,391],{"class":383},[377,595,597,600,602],{"class":379,"line":596},14,[377,598,599],{"class":383},"  \u003C/",[377,601,400],{"class":387},[377,603,391],{"class":383},[377,605,607,610,612],{"class":379,"line":606},15,[377,608,609],{"class":383},"\u003C/",[377,611,388],{"class":387},[377,613,391],{"class":383},[377,615,617],{"class":379,"line":616},16,[377,618,620],{"emptyLinePlaceholder":619},true,"\n",[377,622,624,626,629,632,635,637,639,642,644],{"class":379,"line":623},17,[377,625,384],{"class":383},[377,627,628],{"class":387},"script",[377,630,631],{"class":403}," setup",[377,633,634],{"class":403}," lang",[377,636,407],{"class":383},[377,638,410],{"class":383},[377,640,641],{"class":413},"ts",[377,643,410],{"class":383},[377,645,391],{"class":383},[377,647,649,653,657],{"class":379,"line":648},18,[377,650,652],{"class":651},"swgpB","defineProps",[377,654,656],{"class":655},"sndM8","(",[377,658,659],{"class":383},"{\n",[377,661,663,666,669],{"class":379,"line":662},19,[377,664,665],{"class":387},"  icon",[377,667,668],{"class":383},":",[377,670,671],{"class":383}," {\n",[377,673,675,678,680,683],{"class":379,"line":674},20,[377,676,677],{"class":387},"    type",[377,679,668],{"class":383},[377,681,682],{"class":655}," String",[377,684,685],{"class":383},",\n",[377,687,689,692,694,697,700,703],{"class":379,"line":688},21,[377,690,691],{"class":387},"    default",[377,693,668],{"class":383},[377,695,696],{"class":383}," '",[377,698,699],{"class":413},"i-ph-cursor-click",[377,701,702],{"class":383},"'",[377,704,685],{"class":383},[377,706,708],{"class":379,"line":707},22,[377,709,710],{"class":383},"  },\n",[377,712,714,717],{"class":379,"line":713},23,[377,715,716],{"class":383},"}",[377,718,719],{"class":655},")\n",[377,721,723,725,727],{"class":379,"line":722},24,[377,724,609],{"class":383},[377,726,628],{"class":387},[377,728,391],{"class":383},[344,730,732,733],{"id":731},"integrate-these-components-easily-within-any-markdown-file-using-mdc-syntax","Integrate these components easily within any Markdown file using ",[197,734,736],{"href":735},"/docs/files/markdown#mdc-syntax","MDC syntax",[367,738,743],{"className":739,"code":740,"filename":741,"language":742,"meta":373,"style":373},"language-mdc shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","::home-feature\n  ---\n  icon: i-mdi-vuejs\n  ---\n  #title\n  Embedded Vue components\n  #description\n  Edit slots and props inside the Notion-like editor.\n::\n","content/index.md","mdc",[203,744,745,753,758,767,771,776,781,786,791],{"__ignoreMap":373},[377,746,747,750],{"class":379,"line":380},[377,748,749],{"class":383},"::",[377,751,752],{"class":387},"home-feature\n",[377,754,755],{"class":379,"line":394},[377,756,757],{"class":655},"  ---\n",[377,759,760,762,764],{"class":379,"line":421},[377,761,665],{"class":387},[377,763,668],{"class":383},[377,765,766],{"class":413}," i-mdi-vuejs\n",[377,768,769],{"class":379,"line":442},[377,770,757],{"class":655},[377,772,773],{"class":379,"line":466},[377,774,775],{"class":403},"  #title\n",[377,777,778],{"class":379,"line":476},[377,779,780],{"class":655},"  Embedded Vue components\n",[377,782,783],{"class":379,"line":496},[377,784,785],{"class":403},"  #description\n",[377,787,788],{"class":379,"line":516},[377,789,790],{"class":655},"  Edit slots and props inside the Notion-like editor.\n",[377,792,793],{"class":379,"line":539},[377,794,795],{"class":383},"::\n",[344,797,799],{"id":798},"edit-them-with-our-studio-editors","Edit them with our Studio editors",[187,801,802,803,214,806,809],{},"The visual editor simplifies the component edition, allowing you to integrate and edit them directly in the visual editor. Non technical users can play with ",[234,804,805],{},"slots",[234,807,808],{},"props"," without any technical knowledge.",[187,811,812],{},[249,813],{"alt":814,"src":815},"vue component edition on Studio","/docs/studio/home-content-studio-dark.webp",[187,817,818,819,821,822,824],{},"All components in the ",[203,820,364],{}," folder are available in the editor. Studio users can type ",[203,823,308],{}," anywhere while editing to access the list of available components.",[225,826,827],{"to":177},[187,828,829,830,832],{},"Take a look at this section to validate your ",[203,831,341],{}," component integration in the editor in local development.",[344,834,836],{"id":835},"integrate-built-in-components-from-external-libraries","Integrate built-in components from external libraries",[187,838,839,840,843],{},"By default, you can integrate any component inside a Markdown file and it should work and be editable from Studio but external components ",[234,841,842],{},"won't be displayed in the components list in Studio and can't be integrated manually by a Studio editor",".",[187,845,846],{},"To list this component inside Studio and fetch all its metadata, you need to set it as global in your Nuxt config file.",[187,848,849,850,855],{},"Here is an example to integrate Button and Icon components from the ",[197,851,854],{"href":852,"rel":853},"https://ui.nuxt.com",[329],"Nuxt UI"," library:",[367,857,860],{"className":858,"code":859,"language":641,"meta":373,"style":373},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","export default defineNuxtConfig({\n  hooks: {\n    'components:extend': (components) => {\n      const globals = components.filter(c => ['UButton', 'UIcon'].includes(c.pascalName))\n\n      globals.forEach(c => c.global = true)\n    }\n  },\n})\n",[203,861,862,878,887,914,979,983,1015,1020,1024],{"__ignoreMap":373},[377,863,864,868,871,874,876],{"class":379,"line":380},[377,865,867],{"class":866},"s8pZq","export",[377,869,870],{"class":866}," default",[377,872,873],{"class":651}," defineNuxtConfig",[377,875,656],{"class":655},[377,877,659],{"class":383},[377,879,880,883,885],{"class":379,"line":394},[377,881,882],{"class":387},"  hooks",[377,884,668],{"class":383},[377,886,671],{"class":383},[377,888,889,892,895,897,899,902,906,909,912],{"class":379,"line":421},[377,890,891],{"class":383},"    '",[377,893,894],{"class":387},"components:extend",[377,896,702],{"class":383},[377,898,668],{"class":383},[377,900,901],{"class":383}," (",[377,903,905],{"class":904},"sK9QF","components",[377,907,908],{"class":383},")",[377,910,911],{"class":403}," =>",[377,913,671],{"class":383},[377,915,916,919,922,925,928,930,933,935,938,940,943,945,948,950,953,955,957,959,962,964,967,969,971,973,976],{"class":379,"line":442},[377,917,918],{"class":403},"      const",[377,920,921],{"class":655}," globals",[377,923,924],{"class":383}," =",[377,926,927],{"class":655}," components",[377,929,843],{"class":383},[377,931,932],{"class":651},"filter",[377,934,656],{"class":387},[377,936,937],{"class":904},"c",[377,939,911],{"class":403},[377,941,942],{"class":387}," [",[377,944,702],{"class":383},[377,946,947],{"class":413},"UButton",[377,949,702],{"class":383},[377,951,952],{"class":383},",",[377,954,696],{"class":383},[377,956,448],{"class":413},[377,958,702],{"class":383},[377,960,961],{"class":387},"]",[377,963,843],{"class":383},[377,965,966],{"class":651},"includes",[377,968,656],{"class":387},[377,970,937],{"class":655},[377,972,843],{"class":383},[377,974,975],{"class":655},"pascalName",[377,977,978],{"class":387},"))\n",[377,980,981],{"class":379,"line":466},[377,982,620],{"emptyLinePlaceholder":619},[377,984,985,988,990,993,995,997,999,1002,1004,1007,1009,1013],{"class":379,"line":476},[377,986,987],{"class":655},"      globals",[377,989,843],{"class":383},[377,991,992],{"class":651},"forEach",[377,994,656],{"class":387},[377,996,937],{"class":904},[377,998,911],{"class":403},[377,1000,1001],{"class":655}," c",[377,1003,843],{"class":383},[377,1005,1006],{"class":655},"global",[377,1008,924],{"class":383},[377,1010,1012],{"class":1011},"sPKOg"," true",[377,1014,719],{"class":387},[377,1016,1017],{"class":379,"line":496},[377,1018,1019],{"class":383},"    }\n",[377,1021,1022],{"class":379,"line":516},[377,1023,710],{"class":383},[377,1025,1026,1028],{"class":379,"line":539},[377,1027,716],{"class":383},[377,1029,719],{"class":655},[239,1031,1033,1034,214,1036,245],{"id":1032},"form-editor-yaml-and-json-files","Form editor (",[203,1035,54],{},[203,1037,58],{},[187,1039,1040],{},[249,1041],{"alt":1042,"src":1043},"YAML and JSON edition with auto generated form","/docs/studio/json-yml-forms.png",[187,1045,1046,1047,313,1049,843],{},"This editor removes the need for users to interact directly with complex file syntax such as ",[203,1048,54],{},[203,1050,58],{},[187,1052,279,1053,1055,1056,214,1058,1060],{},[197,1054,282],{"href":32}," provided, a form is generated for both ",[203,1057,54],{},[203,1059,58],{}," files.",[1062,1063,1064],"warning",{},[187,1065,1066],{},"Arrays are not yet handled but should be generated soon thanks to collections and user-defined schemas.",[239,1068,222],{"id":1069},"code-editor",[187,1071,1072],{},[249,1073],{"alt":1074,"src":1075},"Edit directly your raw content with our code editor","/docs/studio/code-editor.webp",[187,1077,1078,1079,313,1082,308,1085,1088],{},"Even though the two previous editors are dedicated to a specific file extension (",[203,1080,1081],{},"md",[203,1083,1084],{},"yaml",[203,1086,1087],{},"json","). The code editor can be used with any kind of file.",[187,1090,1091],{},"It provides full control over your content, allowing you to write raw content directly:",[191,1093,1094,1102],{},[194,1095,1096,1099,1100,205],{},[197,1097,1098],{"href":51},"MDC"," syntax for ",[203,1101,50],{},[194,1103,1104,313,1106,1108],{},[197,1105,58],{"href":59},[197,1107,54],{"href":55}," syntax",[187,1110,1111,1112,1114,1115,313,1117,1119],{},"When your file is saved with the code editor, the content is stored exactly as you've written it, preserving all specific syntax and formatting. This editor is ideal for users comfortable with code syntax (",[203,1113,50],{},", ",[203,1116,54],{},[203,1118,58],{},") who want precise control over structure of their content.",[1121,1122,1123],"style",{},"html pre.shiki code .s86vT, html code.shiki .s86vT{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sd2Uz, html code.shiki .sd2Uz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .s50WR, html code.shiki .s50WR{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sIEYB, html code.shiki .sIEYB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .swgpB, html code.shiki .swgpB{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sndM8, html code.shiki .sndM8{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .s8pZq, html code.shiki .s8pZq{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sK9QF, html code.shiki .sK9QF{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sPKOg, html code.shiki .sPKOg{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}",{"title":373,"searchDepth":442,"depth":442,"links":1125},[1126,1140,1142],{"id":241,"depth":394,"text":1127,"children":1128},"Notion-like editor (Markdown files)",[1129,1130,1131,1132],{"id":265,"depth":421,"text":266},{"id":292,"depth":421,"text":293},{"id":299,"depth":421,"text":168},{"id":334,"depth":421,"text":335,"children":1133},[1134,1135,1136,1138,1139],{"id":346,"depth":442,"text":347},{"id":357,"depth":442,"text":358},{"id":731,"depth":442,"text":1137},"Integrate these components easily within any Markdown file using MDC syntax",{"id":798,"depth":442,"text":799},{"id":835,"depth":442,"text":836},{"id":1032,"depth":394,"text":1141},"Form editor (YAML and JSON files)",{"id":1069,"depth":394,"text":222},"Discover and select your favorite way to manage your content between the visual or the code editor.",null,{},{"title":164},{"title":1148,"description":1149},"Edit your Nuxt Content website with our editors","Overview of our different Studio CMS editors to manage your content and your medias. Choose between our visual editors and our code editor.",[1151,1153],{"title":160,"path":161,"stem":162,"description":1152,"children":-1},"Nuxt Studio is natively synced with GitHub. Install the Nuxt Studio GitHub app and enable content publication on GitHub directly from Studio.",{"title":168,"path":169,"stem":170,"description":1154,"children":-1},"Explore how to browse and manage media files, and integrate them into your projects using Nuxt Content Studio CMS features.",{"data":1156,"body":1157,"excerpt":-1,"toc":1166},{"title":373,"description":1143},{"type":1158,"children":1159},"root",[1160],{"type":1161,"tag":187,"props":1162,"children":1163},"element",{},[1164],{"type":1165,"value":1143},"text",{"title":373,"searchDepth":394,"depth":394,"links":1167},[],1738777687751]